H5: Webapps bouwen

Webapps bouwen (introductie)
WDV-III en DBS-I
Les H5 / Week 3
1 / 39
suivant
Slide 1: Diapositive
Applicatie- en mediaontwikkelaarMBOStudiejaar 1

Cette leçon contient 39 diapositives, avec quiz interactifs, diapositives de texte et 2 vidéos.

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

Éléments de cette leçon

Webapps bouwen (introductie)
WDV-III en DBS-I
Les H5 / Week 3

Slide 1 - Diapositive

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

Klaar met het feedbackmoment
A
Ja

Slide 2 - Quiz

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

Even terugblikken
  • Queries schrijven
  • SELECT
  • INSERT 

Slide 3 - Diapositive

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

Doelen van vandaag

Slide 4 - Diapositive

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

Slide 5 - Diapositive

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

Slide 6 - Diapositive

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

Over deze module
  • Bouwen van een webapplicatie
  • Ondersteuning bij B3 ('takenlijst')
  • HTML, CSS, PHP, SQL
  • 1 les is meestal 1 hoofdstuk; check de studiewijzer
  • Iedere les 1 inleveropdracht
  • Alle theorie te vinden in moduleboekje

Slide 7 - Diapositive

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

Kernbegrippen
Als programmeur hoef je niet álles uit je hoofd te weten, je kunt immers veel dingen opzoeken. Je moet wel basiskennis hebben, anders weet je niet wát je moet opzoeken.

De zwarte cirkels zijn 'kernbegrippen'. Alle andere kennis hangt ermee samen, maar als je het kernbegrip niet kent zal je ook de andere bolletjes nooit weten te vinden.

Slide 8 - Diapositive

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

Kernbegrippen


Kernbegrippen uit het moduleboekje moet je uit je hoofd leren.

Slide 9 - Diapositive

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

Beoordeling
  • Week 3a: schrijven van databasequeries FB13
  • Week 7b: theoretische toets over kernbegrippen FB19.
  • Week 14: einde module 

Zie verder ook moduleboekje.

Slide 10 - Diapositive

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

Basis van een webapp
We gaan kennismaken met drie begrippen:
  • Het CRUD-principe
  • De lagen van een webapp
  • De request/response-cyclus.

Slide 11 - Diapositive

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

Het CRUD-principe
De taken van een webapp

Slide 12 - Diapositive

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

We gaan kennismaken met drie begrippen:
  • Het CRUD-principe
  • De lagen van een webapp
  • De request/response-cyclus.

Slide 13 - Diapositive

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

CRUD
Het CRUD-principe vertelt ons wat een webapp moet doen:

CRUD
Create
Read
Update
Delete

Slide 14 - Diapositive

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

CRUD
Het CRUD-principe vertelt ons wat een webapp moet doen:

CRUD
SQL
Create
INSERT INTO …
Read
SELECT … FROM
Update
UPDATE … SET
Delete
DELETE FROM …

Slide 15 - Diapositive

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

CRUD
Het CRUD-principe vertelt ons wat een webapp moet doen:

CRUD
SQL
HTML
Create
INSERT INTO …
Pagina met formulier
Read
SELECT … FROM
Pagina met lijst of tabel
Update
UPDATE … SET
Aanpas-knop, daarna formulier
Delete
DELETE FROM …
Verwijder-knop

Slide 16 - Diapositive

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

Slide 17 - Diapositive

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

Slide 18 - Diapositive

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

Slide 19 - Diapositive

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

Slide 20 - Diapositive

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


De "C" in CRUD staat voor...
A
C#
B
Create
C
Connect
D
CSS

Slide 21 - Quiz

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


De "r" in CRUD staat voor "read",
dat betekent:
A
Toon een lijst of tabel met alle items
B
Laat een gebruiker bijvoorbeeld een boek lezen
C
Het aanpassen van een bestaande item

Slide 22 - Quiz

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


De U en D staan voor...

Slide 23 - Question ouverte

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

Slide 24 - Diapositive

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

Je maakt een app om games te verkopen. Wat zou een resource kunnen zijn in deze app?

(Kies een van de twee goede antwoorden)
A
Klant
B
Inloggen
C
Game
D
Formulier

Slide 25 - Quiz

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

Je maakt een app om taken bij te houden.
Een voorbeeld van een resource in deze app is een ...

Slide 26 - Question ouverte

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

De lagen van een webapp

Slide 27 - Diapositive

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

Slide 28 - Diapositive

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

Slide 29 - Diapositive

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

Slide 30 - Vidéo

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

De front-end in de browser bestaat uit...
A
HTML, CSS, PHP en C#
B
HTML, CSS en PHP
C
HTML en CSS
D
Alleen HTML

Slide 31 - Quiz

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

Het uitvoeren van query's en dynamisch bouwen van HTML gebeurt in...
A
Database
B
Backend
C
Front-end

Slide 32 - Quiz

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

Request / response

Slide 33 - Diapositive

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

0

Slide 34 - Vidéo

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

Slide 35 - Diapositive

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

Het opvragen van
een pagina is een...
A
request
B
response

Slide 36 - Quiz

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

In een response kun je
terugvinden...
A
HTML, CSS, PHP, C#
B
HTML, CSS, PHP
C
HTML, CSS
D
HTML

Slide 37 - Quiz

C en D allebei goed gerekend. In meeste gevallen natuurlijk C, maar het kan eventueel ook D zijn
REQUEST
RESPONSE
Backend
Database
Front-end

Slide 38 - Question de remorquage

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

En verder...
Kijk nogmaals de kennisclip, en vat deze samen in minimaal drie / maximaal tien "bulletpoints":
  • Lorem ipsum
  • Dolor sit amet
  • ........

Tip: niet vandaag (wel voor volgende les). Blijft beter hangen.

Slide 39 - Diapositive

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