Week 16: Code Challenge 1 & high score implementeren

• JavaScript
• MBO
• Studiejaar 2

Doel van deze les

• Aan het einde van de les heb jij zelfstandig de Again! knop werkend gekregen met de kennis die je tot nu toe hebt opgebouwd.
• Aan het einde van de les heb jij de een functionaliteit geprogrammeerd waarmee de speler zijn/haar high score kan zien.
• Aan het einde van de les ben jij instaat om jouw code op te schonen zodat alleen maar nette en doelgerichte code achterblijft.

Wat heb je nodig?

Voor deze les, moet je Node.js hebben geinstalleerd en basis DOM manipulatie begrijpen. Deze zijn in de vorige les behandeld.

Meer hierover in de studentenhandleiding op onderwijs online.

Waar waren wij gebleven?

Score werkt niet

High score doet niets

Opnieuw spelen lukt niet

mboutrecht.onderwijsonline.nl

Code challenge #1

De code challenge is een onderdeel van het maken van het spel.

Met de kennis die je tot nu toe hebt opgebouwd kan je deze challenge oplossen.

Code challenge #1

Code challenge #1

Docent zal dev mode aanzetten (20 min.)

Hoe ver ben je gekomen in de code challenge?

1. Ik heb t/m deelvraag 1 kunnen maken
2. Ik heb t/m deelvraag 2 kunnen maken
3. Ik heb t/m deelvraag 3 kunnen maken
4. Ik heb t/m deelvraag 4 kunnen maken

Code challenge #1

De docent(e) laat nu zien hoe de code challenge gemaakt moet worden.

Highscore

Het spelletje is bijna af maar er moet nog één feature toegevoegd worden om het helemaal af te maken.

De highscore!

Highscore

Wat moet er met de high score gebeuren?

• Highscore mag alleen geschreven worden wanneer hij hoger is dan de vorige waarde
• Highscore mag alleen geschreven worden wanneer de speler wint

Highscore

In de vorige les hebben wij onze code gedocumenteerd omdat het lang begon te worden.

Waar kunnen wij zo het beste onze code uitbreiden?

Highscore

Wat moeten wij aan het plaatje hiernaast toevoegen om de highscore te implementeren?

Mag de high score hoger zijn dan de score? Dat moet je vragen

Refactoring

Als de code base groot is wordt het gevaarlijk om dubbele code te hebben.

Daarnaast wordt het ook onleesbaar.

Mag de high score hoger zijn dan de score? Dat moet je vragen

Refactoring

Als de code base groot is wordt het gevaarlijk om dubbele code te hebben.

Daarnaast wordt het ook onleesbaar.

Mag de high score hoger zijn dan de score? Dat moet je vragen

Refactoring

Als de code base groot is wordt het gevaarlijk om dubbele code te hebben.

Daarnaast wordt het ook onleesbaar.

Mag de high score hoger zijn dan de score? Dat moet je vragen

Refactoring

Als de code base groot is wordt het gevaarlijk om dubbele code te hebben.

Daarnaast wordt het ook onleesbaar.

Mag de high score hoger zijn dan de score? Dat moet je vragen

Wat waren de doelen?

• Aan het einde van de les heb jij zelfstandig de Again! knop werkend gekregen met de kennis die je tot nu toe hebt opgebouwd.
• Aan het einde van de les heb jij de een functionaliteit geprogrammeerd waarmee de speler zijn/haar high score kan zien.
• Aan het einde van de les ben jij instaat om jouw code op te schonen zodat alleen maar nette en doelgerichte code achterblijft.

Denk je dat je de leerdoelen hebt behaald?

Ja

Nee

Wat gaan wij de volgende keer doen? Meerdere antwoorden mogelijk!

1. Modal window
2. Code challenge!
3. Refactoring
4. Taif trakteren want hij is jarig