Leer hoe je het spelletje Pong kan maken in JavaScript

Leer hoe je het spelletje Pong kan maken in JavaScript

Leerdoelen

- Je leert hoe je een basis Pong spel kan maken in JavaScript.
- Je leert hoe je elementen kan manipuleren met JavaScript.

Vertel de leerlingen wat ze aan het einde van de les zullen hebben geleerd.

Wat weet je al over het maken van spellen in JavaScript?

Wat is Pong?

Pong is een klassiek tafelspel waarbij twee spelers een virtuele bal heen en weer slaan met behulp van virtuele peddels.

Leg kort uit wat Pong is en waarom het populair is geworden.

HTML-structuur

De basis van ons Pong-spel is een HTML-structuur met een canvas-element en twee peddels. De canvas zal fungeren als de speelveld.

Laat de leerlingen zien hoe de HTML-structuur van ons Pong-spel eruitziet.

Opmaak en stijl

We zullen CSS gebruiken om onze HTML-elementen op te maken en stijl toe te voegen aan onze peddels. We kunnen ook de achtergrondkleur van het canvas-element wijzigen.

Laat de leerlingen zien hoe CSS wordt gebruikt om onze Pong-elementen op te maken en stijl toe te voegen.

JavaScript-basis

JavaScript is de taal die we zullen gebruiken om ons Pong-spel te laten werken. We zullen variabelen, functies en voorwaarden gebruiken om de beweging van de bal en peddels te regelen.

Leer de leerlingen over de basisprincipes van JavaScript, zoals variabelen, functies en voorwaarden.

Beweging van de bal

We kunnen de beweging van de bal simuleren door variabelen te gebruiken voor de positie en snelheid van de bal. We zullen ook een functie gebruiken om de bal te tekenen en deze elke keer dat het spel ververst te verplaatsen.

Laat de leerlingen zien hoe ze de beweging van de bal kunnen implementeren in JavaScript.

Beweging van de peddels

We zullen de positie van de peddels regelen met behulp van de muisbewegingen van de gebruiker. We moeten ook controleren of de peddels de bal raken om punten te scoren.

Leer de leerlingen hoe ze de peddels kunnen laten bewegen met behulp van de muisbewegingen van de gebruiker en hoe ze de bal kunnen laten reageren op de peddels.

Winnaar bepalen

We zullen een functie gebruiken om te controleren of een speler de bal mist en dus punten verliest. We zullen ook controleren wie de winnaar is en het spel resetten.

Leer de leerlingen hoe ze de winnaar van het spel kunnen bepalen en hoe ze het spel kunnen resetten.

Schrijf 3 dingen op die je deze les hebt geleerd.

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.

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.

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.