Next.js - From Zero to Hero

Un’immersione completa nel mondo di React e Next.js, per diventare da principianti ad eroi in breve tempo! Il percorso inizia rinfrescando i concetti fondamentali di React, e di seguito fornendo una solida base per la comprensione dei componenti, dello stato e delle proprietà per poi esplorare tutte le peculiarità e feature di Next.js, una potente soluzione (ed ormai standard de facto) per la creazione di applicazioni web performanti e scalabili.

Durata: 36 ore

Livello: Base/Intermedio

Lingua: Italiano

Partecipanti : 5 - 20

Scarica brochure

Cosa Faremo?

Durante il corso, si acquisiranno competenze pratiche attraverso la realizzazione di un progetto reale hands-on e si affronteranno tematiche avanzate come la gestione dello stato globale, le rotte dinamiche, l'ottimizzazione delle prestazioni e la gestione delle chiamate API. Inoltre, saranno introdotti concetti di sviluppo moderni come lo sviluppo basato su componenti, il testing e le migliori pratiche per la manutenzione del codice. L’approccio al corso sarà misto ed includerà quindi sessioni teoriche e di live coding.

Cosa è incluso?

Corso pratico con live coding
Supporto setup environment
Slide in formato PDF
Repository del Progetto
Attestato di Partecipazione
Follow Up di fine corso
Canale Slack dedicato ai partecipanti

Cosa è necessario?

Il proprio computer portatile (con installato un environment che verrà preventivamente segnalato)
Tanta buona volontà e voglia di imparare
Connessione ad Internet

Dove si svolge?

Full-Remote

È possibile svolgere il corso in modalità full-remote con gli strumenti messi a disposizione da Devmy suddividendo, se lo si desidera, il tutto in sessioni da 4h.

Skill minime necessarie & livelli d'accesso

Conoscenza di TypeScript
Conoscenza base di React.js
Conoscenza dei più comuni pattern di programmazione

Argomenti trattati

Introduzione Next.js

Ripassiamo React.js
Vantaggi di utilizzare Next.js
Setup App Next.js

Routing

Routing basato sul file system
Navigazione tra pagine
Layout e gruppi
Routing dinamico

Server Components e Client Components

Fetching dei dati

Data Fetching
Fetch dati dal DB
Caching

Gestione flussi di dati e affidabilità

Streaming
Gestione Errori

Server Actions e Mutations

Server Actions
Storing dei dati
Server Action Response

Gestione dello stato

React Context in Next.js
Server Cookies

Autenticazione e Autorizzazione

Gestione delle sessioni utente
Protezione delle rotte sensibili e visibilità
Introduzione del Middleware

Build e Rendering

Creare una build
Problemi del rendering di React
Differenza e applicazioni pratiche dei diversi tipi di rendering
Deployment di un’app Next.js
Scelte di hosting
Configurazione deployment
Gestione degli ambienti (development, staging, production)

Ottimizzazioni e Best Practices

Ottimizzazione delle immagini
Ottimizzazione dei font
Bundle splitting e code splitting
Migliori pratiche di performance
Come utilizzare i metadata

Testing in Next.js

Approfondimento sul testing di componenti React
Testing di pagine e Api in Next.js
Utilizzo di strumenti e framework per il testing

Argomenti Bonus

Internazionalizzazione (i18n) in Next.js

Implementazioni di funzionalità extra di UI

TailwindCSS
UI Libraries
Animazioni con Framer Motion
Aggiungere Storybook al progetto
Visual Testing

Funzionalità avanzate

Rotte parallele
Route Handlers
Server Actions Ottimistici
Pagina preview di articolo

Contattaci.

Sei interessato a migliorare le competenze del tuo team in ambito di programmazione e sviluppo?

Vuoi maggiori informazioni su questo corso?
Compila il form e ti ricontatteremo a brevissimo.