LEARN BY DOING

Interactive Lecture Labs.

Explore key web-development concepts, change working examples and check your understanding before or after class.

Available labs

Choose a lab to begin.

Bootstrap Cards Lab

Explore card content, images and responsive card grids. Try editable examples, explain what happens, repair a catalogue and check your understanding.

Open lab →Unit 5 · Lecture 145–60 min

Bootstrap Grid Lab

Build responsive layouts with containers, rows and columns. Experiment with the 12-unit grid, breakpoints and nesting, then repair a layout.

Open lab →Unit 5 · Lecture 235 min

Bootstrap Utility Classes Lab

Practise spacing, text, colours and responsive images. Build utility classes, repair missing styles and combine your skills in a final styling challenge.

Open lab →Unit 5 · Lecture 345–60 min

Bootstrap Navbar Lab

Build responsive navbars, connect and repair menu buttons, position links and add dropdowns. Test your code in a live preview.

Open lab →Unit 3 · Lecture 730–40 min

HTML Forms Lab

Explore form controls, edit examples, inspect submitted data and check your understanding.

Open lab →Unit 3 · Lecture 845–60 min

Forms: Styling & Data Validation

Explore CSS selectors, style form controls and test browser validation through editable examples and a repair challenge.

Open lab →