Next.js è diventato lo standard de facto per lo sviluppo web moderno. In questa guida vi portiamo da zero a un sito in produzione, spiegando il perché di ogni scelta.
Perché Next.js nel 2026
React da solo è una libreria. Per costruire un sito reale servono routing, server-side rendering, ottimizzazione immagini, e molto altro. Next.js fornisce tutto questo out-of-the-box, con configurazione zero.
Vercel, l'azienda dietro Next.js, mantiene il framework attivamente. Non rischiate di rimanere bloccati su tecnologia abbandonata.
Setup iniziale
Create un nuovo progetto con npx create-next-app@latest. Selezionate TypeScript (vi ringrazierete dopo), Tailwind CSS (styling semplificato), e App Router (la nuova architettura).
In 30 secondi avete un progetto funzionante con hot reload, linting, e struttura best-practice.
Struttura delle cartelle
App Router usa una struttura basata su filesystem. Ogni cartella in app/ diventa una route. app/about/page.tsx corrisponde a /about. Semplice, prevedibile, potente.
Il primo componente
I componenti Next.js sono React puro. La differenza: potete scegliere se renderizzare sul server o sul client. Di default è server — performance migliori, SEO ottimale. Aggiungete 'use client' solo dove serve interattività.
Deploy su Vercel
Collegare un repository GitHub a Vercel richiede 3 click. Ogni push triggera un deployment automatico. Preview URLs per ogni branch. È quasi troppo facile.