Les 1. Ontdek JavaScript: Een inleiding tot programmeren

• Applicatie- en mediaontwikkelaar
• MBO
• Studiejaar 1

Ontdek JavaScript: Een inleiding tot programmeren

Leerdoel

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

Hoe staan we erin vandaag?

😒🙁😐🙂😃

Wat weet je al over JavaScript?

Inhoud

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

Wat is JavaScript?

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

vb: Youtube, Twitch

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;

JavaScript aan HTML toevoegen 

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

Uitvoeren van het script

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

Wat zijn variabelen

Variabelen in JavaScript worden gebruikt om waarden op te slaan.

let naam = 'Ben';

cons prijs=20;

*Webdesign P.129

 

let

Kan veranderen tijdens runtime.

Block scoped

Kan hem niet herdeclareren

Constanten (cons)

Kan niet veranderen tijdens runtime

Block scoped

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

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.

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