Cos'è un server e a cosa serve Node.js

Dove vive davvero un sito web, cos'è un'API, e perché il modulo del Livello 2 non aveva dove mandare i messaggi.

Ricordi quel modulo senza destinatario?

Al Livello 2, hai costruito un modulo che controllava un messaggio, diceva grazie… e poi buttava via il messaggio. Non c’era dove salvarlo. Il tuo sito web, finora, può solo distribuire file pronti – non può ricevere e ricordare nulla. Per questo serve un server. Ed è esattamente quello che stai per imparare a costruire.

Frontend e backend

Ogni grande applicazione (Instagram, una scuola online, un negozio online) ha due metà:

Frontend – tutto ciò che gira nel browser del visitatore. HTML, CSS, JavaScript, React. Lo conosci già tutto!
Backend – un programma che gira su un server. Riceve richieste, salva dati, applica regole. E grazie a Node.js, può essere scritto in un linguaggio che già conosci: JavaScript.

Come parlano le due metà? Attraverso un’API (Application Programming Interface) – indirizzi concordati dove il backend risponde. Ecco una conversazione di esempio:

Frontend:  GET /api/messages         ("Mandami tutti i messaggi.")
Backend:   [{ "name": "Grandma", "text": "Lovely website!" }]

Frontend:  POST /api/messages        ("Ecco i dati, salvali: ...")
Backend:   { "saved": true }

GET = “dammi i dati” (il browser lo fa ogni volta che apri una pagina).
POST = “ecco i dati, salvali” (è quello che fa il tuo modulo).

I dati viaggiano nel formato JSON – assomiglia quasi esattamente agli oggetti JavaScript che conosci dal quiz. Una coincidenza fortunata? No – JSON sta per JavaScript Object Notation. È dalla tua parte.

Dove gira un backend del genere?

Durante lo sviluppo, sul tuo computer (localhost – lo conosci da Vite). In produzione, su un computer sempre acceso e connesso – o un “fetta” affittata di server (un VPS), o un servizio che gestisce tutto per te (Render, Railway…). Arriveremo al deployment nella lezione finale.

💡

Allora a cosa serviva GitHub Pages? È hosting solo per il frontend – distribuisce file, nient’altro. Perfetto per un sito web del Livello 1–2 (ed è anche il più sicuro: dove non gira nulla, nulla può essere hackerato). Serve un backend nel momento in cui il sito web deve ricevere e ricordare qualcosa – messaggi, iscrizioni, utenti.

Ora tocca a te 💪 (una mini-missione per curiosità)

Apri il tuo sito web preferito, premi F12, e passa alla scheda Network. Ricarica la pagina e guarda la cascata di richieste – ogni riga è una conversazione tra browser e server.
Trova una richiesta GET nella lista, e una che restituisce JSON (colonna Type: json o fetch). Cliccala e guarda la risposta – vedrai i dati da cui è costruita la pagina.
Scrivi questo nella console e guarda il frontend chiedere dati da solo:

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

fetch(...) è il comando JavaScript “chiama un’API.” Nella lezione 9, userai esattamente questo comando per collegare un modulo al tuo server.

✅

Controlla da solo: Puoi spiegare con parole tue la differenza tra frontend e backend, sai cosa sono GET, POST e JSON, e hai visto nel pannello Network come i siti web parlano tra loro. Nella prossima lezione costruirai un server così da solo.

Cosa porti via da questa lezione

Il frontend gira sul dispositivo del visitatore, il backend gira su un server; parlano tramite un’API con messaggi GET (dare) e POST (salvare).
I dati viaggiano nel formato JSON – assomiglia agli oggetti JavaScript.
fetch() è come un frontend chiede dati a un server.