Co je server a k čemu je Node.js

Kde web vlastně bydlí, co je API a proč formulář z Poziomy 2 neměl kam posílat vzkazy.

Vzpomínáš na formulář bez adresáta?

V Úrovni 2 jsi postavil(a) formulář, který vzkaz zkontroloval, poděkoval… a vzkaz zahodil. Nebylo ho kam uložit. Tvůj web totiž zatím umí jen rozdávat hotové soubory – neumí nic přijmout a zapamatovat si. Na to potřebuje server. A přesně ten se naučíš postavit.

Frontend a backend

Každá velká aplikace (Instagram, škola online, e-shop) má dvě půlky:

Frontend – co běží v prohlížeči návštěvníka. HTML, CSS, JavaScript, React. To všechno už umíš!
Backend – program běžící na serveru. Přijímá požadavky, ukládá data, hlídá pravidla. A protože existuje Node.js, může být napsaný v jazyce, který už znáš: v JavaScriptu.

Jak si ty dvě půlky povídají? Přes API (Application Programming Interface) – domluvené adresy, na kterých backend odpovídá. Ukázka rozhovoru:

Frontend:  GET /api/vzkazy          („Pošli mi všechny vzkazy.")
Backend:   [{ "jmeno": "Babička", "text": "Krásný web!" }]

Frontend:  POST /api/vzkazy         („Ulož nový vzkaz: …")
Backend:   { "ulozeno": true }

GET = „dej mi data” (to dělá prohlížeč pokaždé, když otevřeš stránku).
POST = „tady máš data, ulož je” (to udělá tvůj formulář).

Data se posílají ve formátu JSON – vypadá skoro přesně jako JavaScriptové objekty, které znáš z kvízu. Šťastná náhoda? Ne – JSON znamená JavaScript Object Notation. Hraje ti to do karet.

Kde takový backend běží?

Při vývoji u tebe v počítači (localhost – znáš od Vite). V provozu na počítači, který je pořád zapnutý a připojený – buď pronajatý „kus” serveru (VPS), nebo služba, která se o všechno postará (Render, Railway…). K nasazení se dostaneme v poslední lekci.

💡

A k čemu byl tedy GitHub Pages? To je hosting jen pro frontend – rozdává soubory, nic víc. Pro web z Poziomy 1–2 ideální (a taky nejbezpečnější: kde nic neběží, nejde nic hacknout). Backend potřebuješ až ve chvíli, kdy má web něco přijímat a pamatovat si – vzkazy, přihlášky, uživatele.

Teraz ty 💪 (mini-mise na zvědavost)

Otevři svůj oblíbený web, zmáčkni F12 a přepni na záložku Network (Síť). Obnov stránku a sleduj vodopád požadavků – každý řádek je jeden rozhovor prohlížeče se serverem.
Najdi v seznamu nějaký požadavek typu GET a nějaký, který vrací JSON (sloupec Type: json nebo fetch). Klikni na něj a prohlédni si odpověď – uvidíš data, ze kterých se stránka skládá.
Do konzole napiš tohle a sleduj, jak si frontend říká o data sám:

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

fetch(...) je JavaScriptový příkaz „zavolej API”. Přesně tímhle příkazem napojíš v 9. lekci formulář na svůj vlastní server.

✅

Kontrola: Umíš vysvětlit vlastními slovy rozdíl mezi frontendem a backendem, víš, co je GET, POST a JSON, a viděl(a) jsi v Network panelu, jak si weby povídají. V příští lekci si takový server postavíš.

Co si z téhle lekce odnést

Frontend běží u návštěvníka, backend na serveru; povídají si přes API zprávami GET (dej) a POST (ulož).
Data tečou ve formátu JSON – vypadá jako JavaScriptové objekty.
fetch() je způsob, jak si frontend říká serveru o data.

Ta lekcja je częścią płatnego poziomu

Vzpomínáš na formulář bez adresáta?

Frontend a backend

Kde takový backend běží?

Teraz ty 💪 (mini-mise na zvědavost)

Co si z téhle lekce odnést