FabioBiondi.
← tutti i corsi
// corso · 2026react

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
[ descrizione ]

Di cosa parla
questo corso.

Contesto, obiettivi e taglio del corso. Tutto è personalizzabile in base a stack e team — questa è la base di partenza.

§01

Introduzione

NextJS è uno dei framework "fullstack" di nuova generazione più utilizzati nel mercato. È basato su React ed è indicato per la creazione di landing page e applicazioni web performanti e ottimizzate per i motori di ricerca.

§02

Obiettivi del corso

Un corso introduttivo per comprendere le fondamenta del framework NextJS nella sua ultima versione e che vi permetterà di:

  • • 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...
§03

Requisiti

Un corso rivolto agli sviluppatori che già utilizzano React e/o hanno una certa confidenza nell'utilizzo della sintassi JSX e di framework di ultima generazione
[ programma ]

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.

6 moduli · 46 argomenti
  1. M01

    FUNDAMENTALS

    • Installazione e configurazione
    • Struttura di un progetto Next / TypeScript
    • Gestione Layout
    • Ottimizzazione Fonts
    • Gestione CSS locale e Globale
    • Page Metadata
    • Gestione e ottimizzazione Immagini
  2. M02

    ROUTER

    • Creare applicazioni multi-view con "App Router"
    • Pages
    • Client Side Navigation
    • Dynamic Routes
    • Nested Routes
    • Nested Layouts
    • Ottimizzazione caricamenti e rendering
  3. M03

    COMPONENTS & RENDERING

    • Dynamic e Static Rendering: SSR vs SSG vs ISG
    • React Server Component: teoria ed esempi
    • React Client Component: teoria ed esempi
    • Server e Client Component nella stessa route
    • Relazioni tra Server Component e Client Component
    • Ottimizzazione caricamenti: HTML streaming e Suspense
    • Ottimizzazioni rendering
    • Ottimizzazione caricamenti e rendering
  4. M04

    SERVER

    • fetch e server rendering
    • Gestione cache
    • Gestione "Loading" state
    • Gestione "Errori"
    • Fetch multiple e sequenziali
    • Fetch parallele
    • Creare routine riutilizzabili
    • Form e Server Actions
    • Creazione REST API / route endpoint
  5. M05

    STATE MANAGEMENT

    • Stato locale
    • Global State con Context
    • Global State con Zustand
  6. M06

    PROGETTO REAL WORLD

    • Creazione di una Landing Page con contenuti statici e dinamici
    • Styling con Tailwind
    • Ottimizzazione font, css e immagini
    • Gestione router
    • Organizzazione progetto in componenti e layout
    • Utilizzo di Server e Client Component
    • Ottimizzazione caricamenti
    • Creazione form di contatto con le Server Actions
    • Catalogo prodotti
    • Carrello della spesa
    • Ottimizzazione SEO e Core Web Vitals
    • Deploy su Vercel

Pronto a portarlo nel tuo team?

Contattami →