πŸš€Webontwikkeling basics Β· Les 2

🌍 Hoe werkt het internet?

Je typt een adres in je browser en een halve seconde later zie je een website. Maar wat gebeurt er dan precies? In deze les ga je achter de schermen kijken.

πŸ• ~12 minuten Les 1 afgerond? Prima

Client en server

Het internet werkt met een simpel principe: er is altijd een vrager en een beantwoorder. De vrager heet de client, de beantwoorder heet de server.

πŸ’»

Client

Jouw browser

Request β†’
← Response
πŸ–₯️

Server

Altijd aan

πŸ’‘ Wat betekent dit?

Client = de computer of telefoon van de bezoeker, met een browser erop. Server = een krachtige computer ergens in een datacenter die altijd aanstaat en klaar is om verzoeken te beantwoorden.

Domeinnamen en DNS

Servers hebben een IP-adres β€” een getal zoals 185.220.101.42. Dat onthoud je niet. Daarom gebruiken we domeinnamen zoals mbo-sd.com.

Er is een systeem dat domeinnamen vertaalt naar IP-adressen: DNS (Domain Name System). Het werkt als een telefoonboek van het internet.

Wat er gebeurt als je "mbo-sd.com" intypt

1

Browser vraagt aan DNS: "Wat is het IP van mbo-sd.com?"

2

DNS antwoordt: "Het IP is 185.220.101.42"

3

Browser stuurt een request naar 185.220.101.42

4

Server stuurt de HTML/CSS/JS terug β†’ pagina verschijnt

πŸ’‘ Wat betekent dit?

Een domeinnaam koop je bij een registrar (bijv. TransIP, GoDaddy). Je koppelt hem via DNS aan het IP-adres van jouw server. Dat koppelen noem je een DNS-record instellen.

HTTP en HTTPS

HTTP staat voor HyperText Transfer Protocol β€” het is de taal waarmee browser en server met elkaar praten. Iedere keer als je een pagina laadt, stuurt je browser een HTTP-request en krijgt een HTTP-response terug.

Request (browser β†’ server)

GET /contact HTTP/1.1

Host: mbo-sd.com

Accept: text/html

Response (server β†’ browser)

HTTP/1.1 200 OK

Content-Type: text/html

<html> ... </html>

HTTP vs HTTPS

⚠

HTTP β€” communicatie is niet versleuteld. Iemand op hetzelfde netwerk kan meekijken.

πŸ”’

HTTPS β€” alles is versleuteld via TLS. De browser toont een slotje. Tegenwoordig de standaard.

πŸ’‘ Wat betekent dit?

Als jij als developer een website publiceert, installeer je een TLS-certificaat (vroeger SSL-certificaat). Dat is gratis via Let's Encrypt. Zonder het slotje vertrouwt de browser je site minder.

De volledige reis van een URL

Nu passen we alles samen. Wat er achter de schermen gebeurt in de ~500 milliseconden tussen jouw Enter en de pagina die verschijnt:

1

Jij typt: https://mbo-sd.com/start-2

Browser kijkt eerst in zijn eigen DNS-cache. Niets? Dan vraagt hij het aan de DNS-server van jouw provider.

2

DNS geeft het IP-adres terug

Dit duurt typisch 10–50 ms. Daarna weet de browser waar hij naartoe moet.

3

Browser maakt een TCP-verbinding + TLS-handshake

Browser en server spreken af hoe ze beveiligde berichten uitwisselen. Dit heet de TLS-handshake β€” typisch 50–150 ms.

4

Browser stuurt een HTTP GET-request

"Geef me de pagina /start-2, ik accepteer HTML"

5

Server antwoordt: 200 OK + HTML

Browser ontvangt de HTML, laadt de CSS en JS erbij, en toont de pagina.

πŸ’‘ Wat betekent dit?

Als developer gebruik je de Netwerk-tab in de DevTools van je browser (F12) om al deze stappen te zien. Je kunt precies zien welke bestanden geladen worden, hoe groot ze zijn en hoe lang het duurt.

βœ… Wat heb je geleerd?

  • βœ“ Het internet werkt met clients (browsers) die requests sturen naar servers die responses terugsturen.
  • βœ“ DNS vertaalt een domeinnaam naar een IP-adres β€” het telefoonboek van het internet.
  • βœ“ HTTP is het protocol waarmee browser en server praten. HTTPS is de beveiligde variant (met slotje).
  • βœ“ Elke paginabezoek is een requestβ†’response-cyclus die typisch < 500 ms duurt.

🧠 Kennischeck

Klaar met deze les!

In de volgende les kijken we naar het verschil tussen frontend en backend.