Formation Next.js
Next.js est un framework de développement web open source basé sur JavaScript (ou TypeScript) et React. Il permet de structurer son application React et facilite la mise en place du rendu côté serveur (SSR) et de la génération de site statiques (SSG). Dans notre formation Next.js nous verrons comment créer et configurer un projet Next.js, comment fonction le routeur, le rendu côté serveur, la génération de sites statiques, le pré-rendu côté serveur, le code splitting, la gestion optimisée du rendu côté client, le hot reloading, etc... Cette formation Next.js s'adresse aux développeurs ou chefs de projets techniques désireux d'avoir un discours à jour par rapport à l'écosystème React. Une grande part de la formation Next.js est tournée vers la pratique.
Objectifs pédagogiques
- Comprendre l'architecture de Next.js
- Créer et configurer un projet Next.js
- Utiliser le routeur
- Echanger avec le serveur
- Optimiser son application web
Pré-requis
- Maitrise de JavaScript ou TypeScript
- Connaissance du fonctionnement de React
Public
- Développeurs
- Chefs de projets
Programme
Jour 1
Introduction
- Installation
- Rappels sur React
- Structure d'un project Next.js
- App Router vs Pages Router
- Server Components vs Client Components
Configuration
- TypeScript
- ESLint
- Variables d'environnement
- Imports absolus et Aliases de chemin de module
- MDX
- Le répertoire src
- Mode brouillon
Routing
- Définition des routes
- Pages et layouts
- Liens et navigation
- Groupes de routes
- Routes dynamiques
- Chargement et streaming
- Gestion des erreurs
- Routage parallèle
- Intercepteurs de routes
- Gestionnaires de routes
- Middlewares
- Organisation du projet
- Internationalisation
Jour 2
Rendering
- Static et Dynamic
- Platerformes Edge et Node.js
Echanges serveur
- * Récupération des données
- Mise en cache
- Invalidation
- Actions serveur
Mise en forme
- CSS Modules
- Tailwind CSS
- CSS-in-JS
- Sass
Jour 3
Optimisation
- Images
- Polices
- Scripts
- Metadonnées
- Assets statiques
- Lazy Loading
- Analytics
- OpenTelemetry
- Instrumentation
Deploiement
- Exports Statiques
- Vercel
Méthodes mobilisées
- Un formateur validé par nos équipes techniques et pédagogiques sera présent pendant toute la durée de la formation
- Pour les formations en présentiel, une salle de formation sera mise à disposition et équipée d'ordinateurs portables, d'un accès Wi-Fi, d'un projecteur et d'un tableau blanc. En distanciel la session sera suivie sur Zoom ou autre outil de visioconférence sur demande (Teams, Webex, Google Meet...).
- Un support de cours en version numérique sera remis à chaque participant
Modalités d’évaluation
- Questions orales ou écrites (QCM)
- Exercices pratiques
- Auto-positionnement en amont et aval de la formation