Les 1. Ontdek JavaScript: Een inleiding tot programmeren

Ontdek JavaScript: Een inleiding tot programmeren
1 / 17
suivant
Slide 1: Diapositive
Applicatie- en mediaontwikkelaarMBOStudiejaar 1

Cette leçon contient 17 diapositives, avec quiz interactifs et diapositives de texte.

time-iconLa durée de la leçon est: 60 min

Éléments de cette leçon

Ontdek JavaScript: Een inleiding tot programmeren

Slide 1 - Diapositive

Cet élément n'a pas d'instructions

Leerdoel
Aan het einde van de les kun je de basisconcepten van JavaScript begrijpen en je eerste script schrijven en uitvoeren.

Slide 2 - Diapositive

Cet élément n'a pas d'instructions

Hoe staan we erin vandaag?
😒🙁😐🙂😃

Slide 3 - Sondage

Cet élément n'a pas d'instructions

Wat weet je al over JavaScript?

Slide 4 - Carte mentale

Cet élément n'a pas d'instructions

Inhoud
  • Wat is javascript
  • Basis syntax en regels
  • JavaScript aan HTML toevoegen
  • console.log gebruiken
  • Variabelen

Slide 5 - Diapositive

Cet élément n'a pas d'instructions

Wat is JavaScript?
 JavaScript is een programmeertaal die gebruikt wordt om webpagina's interactief te maken.

vb: Youtube, Twitch

Slide 6 - Diapositive

Cet élément n'a pas d'instructions

Basis syntax van JavaScript
  • Open en close tags : <script>.......</script>
  • Blok:  {.....}
  • Commentaar op 1 regel : // mijn code comment
  • Commentaar meerdere:  /* mijn code comment */
  • Variabelen: let var =1;

Slide 7 - Diapositive

Cet élément n'a pas d'instructions

JavaScript aan HTML toevoegen 

Slide 8 - Diapositive

Maak een editor open en codeer dit samen met de studenten stap voor stap.
Leg uit:
  • Folder structuur
  • Index html
  • Script tag
  • Externe script met map
Console.log
Als jij je code aan het debuggen ben gebruik je:

console.log(  );


*Dit is een ingebouwde functie van javascript

Slide 9 - Diapositive

Cet élément n'a pas d'instructions

Uitvoeren van het script
We zullen ons geschreven script uitvoeren in een webpagina om het resultaat te zien.

Slide 10 - Diapositive

Cet élément n'a pas d'instructions

Wat zijn variabelen
Variabelen in JavaScript worden gebruikt om waarden op te slaan.
let naam = 'Ben';
cons prijs=20;


*Webdesign P.129

 

Slide 11 - Diapositive

Cet élément n'a pas d'instructions

let
Kan veranderen tijdens runtime.
Block scoped
Kan hem niet herdeclareren
Constanten (cons)
Kan niet veranderen tijdens runtime
Block scoped

Slide 12 - Diapositive

Cet élément n'a pas d'instructions

Wat:
Maak een variabel aan en toon dit in de console
Hoe:
Maak een html pagina aan.
Maak een script blok.
Maak een variabel aan.
Gebruik console.log om deze te tonen 
Hulp
-w3schools.com/js/js_output.asp
- Vraag het aan je buurman
- Vraag het aan de docent

Tijd: 5 minuten

Klaar:
Laat het aan de docent zien

Slide 13 - Diapositive

Cet élément n'a pas d'instructions

Schrijf 3 dingen op die je deze les hebt geleerd.

Slide 14 - Question ouverte

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 15 - Question ouverte

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 16 - Question ouverte

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.
Bron: 
Webdesign Pagina 129
w3schools.com/js/js_output.asp
w3schools.com/js/js_variables.asp
w3schools.com/js/js_let.asp
w3schools.com/js/js_const.asp




Slide 17 - Diapositive

Cet élément n'a pas d'instructions