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
Accessibilité aux personnes handicapées
Nous nous engageons à rendre notre formation Next.js accessible aux personnes en situation de handicap. Merci de nous contacter afin que nous puissions réaliser les adaptations nécessaires en amont de la formation.Avis
Aurélie T.
Léa M.
La formation
Bon équilibre entre pratique et théorie mais j'aurais aimé un TP "final" qui récap' un peu tous les sujets abordés.
Commentaire général
Je ne me sens pas opérationnelle parce que 3 jours ne sont pas suffisants pour maitriser le sujet, mais la formation a posé de bonnes bases, et je saurais maintenant quoi et comment chercher pour continuer à progresser par moi même.
Paul d.
Renaud T.
La formation
Romain est un très bon intervenant.
Les explications étaient très claires et interessantes.
Merci encore pour sa patience.
Le formateur
Très bien.
