Next.js 16
Un corso introduttivo sulle funzionalità principali di Next.js: App Router, RSC, Suspense, caching.

- Durata
- 12h
- Sessioni
- 3 da 4h
- Livello
- Intermedio
Di cosa parla
questo corso.
Contesto, obiettivi e taglio del corso. Tutto è personalizzabile in base a stack e team — questa è la base di partenza.
Introduzione
Obiettivi del corso
- • creare siti web statici e dinamici sfruttando diverse strategie di rendering tra cui la static generation (SSG o static render) e Server Side Rendering (SSR o Dynamic Render)
- • applicazioni web interattive full stack
- • raggiungere prestazioni elevate e ottimi punteggi dei Core Web Vitals
- • ottimizzare il sito/app per la SEO **
In generale, comprendere buona parte delle API principali del framework : routing, layouts, forms, comunicazione con il server e molto altro...
Requisiti
Cosa vediamo,
in dettaglio.
Il programma viene rifinito con il team prima del corso, in base a stack, obiettivi e livello. Quella che vedi è la base: possiamo accelerare o approfondire dove serve e, se necessario, modificare il programma.
La maggior parte del corso è live-coding, con esempi pratici.
M01 FUNDAMENTALS
- 01Installazione e configurazione
- 02Struttura di un progetto Next / TypeScript
- 03Gestione Layout
- 04Ottimizzazione Fonts
- 05Gestione CSS locale e Globale
- 06Page Metadata
- 07Gestione e ottimizzazione Immagini
M02 ROUTER
- 01Creare applicazioni multi-view con "App Router"
- 02Pages
- 03Client Side Navigation
- 04Dynamic Routes
- 05Nested Routes
- 06Nested Layouts
- 07Ottimizzazione caricamenti e rendering
M03 COMPONENTS & RENDERING
- 01Dynamic e Static Rendering: SSR vs SSG vs ISG
- 02React Server Component: teoria ed esempi
- 03React Client Component: teoria ed esempi
- 04Server e Client Component nella stessa route
- 05Relazioni tra Server Component e Client Component
- 06Ottimizzazione caricamenti: HTML streaming e Suspense
- 07Ottimizzazioni rendering
- 08Ottimizzazione caricamenti e rendering
M04 SERVER
- 01
fetche server rendering - 02Gestione cache
- 03Gestione "Loading" state
- 04Gestione "Errori"
- 05Fetch multiple e sequenziali
- 06Fetch parallele
- 07Creare routine riutilizzabili
- 08Form e Server Actions
- 09Creazione REST API / route endpoint
- 01
M05 STATE MANAGEMENT
- 01Stato locale
- 02Global State con Context
- 03Global State con Zustand
M06 PROGETTO REAL WORLD
- 01Creazione di una Landing Page con contenuti statici e dinamici
- 02Styling con Tailwind
- 03Ottimizzazione font, css e immagini
- 04Gestione router
- 05Organizzazione progetto in componenti e layout
- 06Utilizzo di Server e Client Component
- 07Ottimizzazione caricamenti
- 08Creazione form di contatto con le Server Actions
- 09Catalogo prodotti
- 10Carrello della spesa
- 11Ottimizzazione SEO e Core Web Vitals
- 12Deploy su Vercel
Prima di questo corso...
4h · IntermedioWeb Performance & Core Web Vitals
Una masterclass dedicata alle Web Performance, ai Core Web Vitals e alle strategie di rendering dei framework full-stack di ultima generazione.
16h · BaseReact Core Concepts (TypeScript)
Le fondamenta per creare Single Page Application in React e TypeScript.
Potrebbero piacerti anche...
12h · IntermedioMastering React: oltre le basi
Organizzazione progetti, router, autenticazione e creazione layout dinamici in React.
12h · IntermedioReact: State Management & Performance
Panoramica sulle strategie di state management in React: API native, Context, Redux Toolkit, Zustand, TanStack Query.
12h · AvanzatoReact UI: UIKIT riutilizzabile
Crea un UIKIT di componenti React flessibili e riutilizzabili. Storybook per documentare, sperimentare, testare.