Hvad en server er, og hvad Node.js er til

Hvor en hjemmeside faktisk bor, hvad en API er, og hvorfor niveau 2-formularen ingen steder at sende sine beskeder havde.

Husker du den formular uden modtager?

I niveau 2 byggede du en formular, der tjekkede en besked, sagde tak… og smed beskeden væk. Der var ingen steder at gemme den. Din hjemmeside kan indtil videre kun uddele færdige filer – den kan ikke modtage og huske noget. Til det har du brug for en server. Og det er præcis det, du er ved at lære at bygge.

Frontend og backend

Enhver stor applikation (Instagram, en online skole, en onlinebutik) har to halvdele:

Frontend – alt der kører i besøgendes browser. HTML, CSS, JavaScript, React. Det kender du allerede!
Backend – et program, der kører på en server. Det modtager forespørgsler, gemmer data, håndhæver regler. Og fordi Node.js eksisterer, kan det skrives i et sprog, du allerede kender: JavaScript.

Hvordan taler de to halvdele med hinanden? Gennem en API (Application Programming Interface) – aftalte adresser, hvor backenden svarer. Her er en prøvesamtale:

Frontend:  GET /api/messages         ("Send me all the messages.")
Backend:   [{ "name": "Grandma", "text": "Lovely website!" }]

Frontend:  POST /api/messages        ("Here's data, save it: ...")
Backend:   { "saved": true }

GET = “giv mig data” (din browser gør dette hver gang du åbner en side).
POST = “her er data, gem dem” (det er det, din formular gør).

Data sendes i JSON-formatet – det ligner næsten de JavaScript-objekter, du kender fra quizzen. En heldig tilfældighed? Nej – JSON står for JavaScript Object Notation. Det er på din side.

Hvor kører en backend som den?

Under udvikling på din egen computer (localhost – du kender det fra Vite). I produktion på en computer, der altid er tændt og forbundet – enten en lejet “skive” af en server (en VPS), eller en tjeneste, der håndterer alt for dig (Render, Railway…). Vi kommer til deployment i den sidste lektion.

💡

Så hvad var GitHub Pages til? Det er hosting kun til frontend – den udleverer filer, intet mere. Perfekt til en niveau 1–2-hjemmeside (og også den sikreste: hvor intet kører, kan intet hackes). Du har brug for en backend i det øjeblik, din hjemmeside skal modtage og huske noget – beskeder, tilmeldinger, brugere.

Nu er det din tur 💪 (en mini-mission af nysgerrighed)

Åbn din yndlingshjemmeside, tryk F12, og skift til fanen Network. Genindlæs siden og se vandfaldet af forespørgsler – hver linje er én samtale mellem browseren og en server.
Find en GET-forespørgsel på listen, og én der returnerer JSON (Type-kolonne: json eller fetch). Klik på den og kig på svaret – du ser dataene, siden er bygget af.
Skriv dette i konsollen og se frontend bede om data på egen hånd:

fetch("https://api.chucknorris.io/jokes/random")
  .then((response) => response.json())
  .then((data) => console.log(data.value));

fetch(...) er JavaScript-kommandoen “kald en API.” I lektion 9 bruger du præcis denne kommando til at forbinde en formular til din egen server.

✅

Tjek dig selv: Du kan forklare med dine egne ord forskellen mellem frontend og backend, du ved, hvad GET, POST og JSON er, og du har set i Network-panelet, hvordan hjemmesider taler med hinanden. I næste lektion bygger du en server som den selv.

Det tager du med fra denne lektion

Frontend kører på besøgendes enhed, backend kører på en server; de taler gennem en API med GET (giv) og POST (gem)-beskeder.
Data flyder i JSON-formatet – det ligner JavaScript-objekter.
fetch() er, hvordan en frontend beder en server om data.