Ontdek CSS Frameworks: Tailwind vs. Bootstrap

Ontdek CSS Frameworks: Tailwind vs. Bootstrap
1 / 14
next
Slide 1: Slide

This lesson contains 14 slides, with interactive quizzes and text slides.

Items in this lesson

Ontdek CSS Frameworks: Tailwind vs. Bootstrap

Slide 1 - Slide

This item has no instructions

Lesdoelen
Aan het einde van de les kun je het verschil uitleggen tussen Tailwind en Bootstrap en kun je een basisontwerp maken met Tailwind.

Slide 2 - Slide

This item has no instructions

Wat weet je al over CSS frameworks?

Slide 3 - Mind map

This item has no instructions

Oriënteren: Voorkennis activeren
Bespreek kort wat de studenten al weten over CSS frameworks, inclusief hun ervaring met Bootstrap.

Slide 4 - Slide

This item has no instructions

Inleiding tot Tailwind
Uitleg over wat Tailwind CSS is en hoe het verschilt van traditionele frameworks zoals Bootstrap.

Slide 5 - Slide

This item has no instructions

Voorbeeld van Tailwind
Demonstratie van het gebruik van Tailwind classes voor het stylen van een eenvoudige webpagina.

Slide 6 - Slide

This item has no instructions

Klassikale oefening: Tailwind vs. Bootstrap
Vergelijkende analyse van hetzelfde ontwerp gemaakt met Tailwind en Bootstrap.

Slide 7 - Slide

This item has no instructions

Individuele oefening: Tailwind styling
Laat de studenten individueel een eenvoudig ontwerp maken met behulp van Tailwind classes.

Slide 8 - Slide

This item has no instructions

Na bespreking
Bespreking van de individuele oefening en het delen van beste praktijken bij het gebruik van Tailwind.

Slide 9 - Slide

This item has no instructions

Differentiëren: Verdere toepassing
Geef een verdiepende opdracht waarbij de studenten een meer complex ontwerp maken met Tailwind.

Slide 10 - Slide

This item has no instructions

Terugblikken: Lesdoelen toetsen
Evalueer de lesdoelen door te vragen naar het verschil tussen Tailwind en Bootstrap en de toepassing van Tailwind classes.

Slide 11 - Slide

This item has no instructions

Schrijf 3 dingen op die je deze les hebt geleerd.

Slide 12 - Open question

De leerlingen voeren hier drie dingen in die ze in deze les hebben geleerd. Hiermee geven ze aan wat hun eigen leerrendement van deze les is.
Schrijf 2 dingen op waarover je meer wilt weten.

Slide 13 - Open question

De leerlingen voeren hier twee dingen in waarover ze meer zouden willen weten. Hiermee vergroot je niet alleen betrokkenheid, maar geef je hen ook meer eigenaarschap.
Stel 1 vraag over iets dat je nog niet zo goed hebt begrepen.

Slide 14 - Open question

De leerlingen geven hier (in vraagvorm) aan met welk onderdeel van de stof ze nog moeite. Voor de docent biedt dit niet alleen inzicht in de mate waarin de stof de leerlingen begrijpen/beheersen, maar ook een goed startpunt voor een volgende les.