Formation Next.js 15 — App Router, Server Actions et déploiement
Apprenez à créer des applications web interactives avec Next.js. Une formation complète pour développer des applications modernes, claires et efficaces, même sans être expert en code.
En résumé
Durée :
3 jours (21h)Réf :
B-WF-NJS V1 du 18/07/2025Prix :
1 950€ HTPour qui est cette formation ? :
Développeur web maîtrisant déjà React souhaitant passer à Next.js
DevOps familier avec les langages web (HTML, JavaScript, CSS)
Développeur back-end souhaitant développer des applications full-stack
Lead developer souhaitant industrialiser le rendu d'applications React
Pré-requis :
Aucune connaissance particulièreProchaine session :
- 2026-05-05
- 2026-09-16
- 2026-11-18
Programme de la formation
Objectifs pédagogiques
À l’issue de la formation, le participant sera en mesure de :
- Comprendre les fondamentaux de Next.js 15 et son rôle dans l’écosystème React
- Utiliser l’App Router (nouveauté depuis v13+)
- Maîtriser les rendus SSR, SSG, ISR, et Client Components
- Créer des pages dynamiques avec routing avancé
- Intégrer des appels API (data fetching, Server Actions)
- Déployer une application Next.js
PROGRAMME
1. Javascript
- Next.js dans l’écosystème React
- Pages Router vs App Router : pourquoi migrer
- Structure d’un projet avec /app
- Server vs Client components
- Atelier de mise en pratique
Objectif opérationnel : Création d’une première application avec App Router
Moyen d’évaluation : QCM
2. Routing et Navigation
- Créer des routes statiques/dynamiques [slug]
- Pages d’erreur : error.tsx, not-found.tsx, loading.tsx
- Création de layout persistant : layout.tsx, template.tsx
- Navigation entre pages, Link, useRouter
- Atelier de mise en pratique
Objectif opérationnel : Créer une navigation dynamique avec layout personnalisé
Moyen d’évaluation : QCM
3. Static & Dynamic Rendering
- Différences SSR, SSG, ISR, Client Rendering
- Optimisation via streaming (suspense, loading.tsx)
- Utilisation de fetch() dans Server Components
- Caching : revalidate, cache: 'no-store'
- Atelier de mise en pratique
Objectif opérationnel : Intégration d’une API en mode SSG + ISR
Moyen d’évaluation : QCM
4. Gestion des données et Server Actions
- Accès aux données : API, ORM (ex: Prisma), fichiers distants
- Introduction aux Server Actions ("use server")
- Formulaires avec actions côté serveur
- Validation des entrées (zod)
- Atelier de mise en pratique
Objectif opérationnel : Création d’un formulaire dynamique avec Server Action
Moyen d’évaluation : QCM
5. Authentification & Middleware
- Introduction à Auth.js (NextAuth)
- Sessions utilisateur côté serveur
- Proteger des routes avec middleware.ts
- Atelier de mise en pratique
Objectif opérationnel : Implémenter un système d’authentification et d’accès restreint
Moyen d’évaluation : QCM
6. Pratiques avancées & Déploiement
- Gestion des erreurs globales
- Accessibilité : composants accessibles
- Stockage d’images, gestion des assets statiques
- Déploiement
- Atelier de mise en pratique
Objectif opérationnel : Déployer une application Next.js
Moyen d’évaluation : QCM
Informations pratiques
- Théorie 40%
- Pratique 60%
- Lieu au choix : Centre de formation bewizyu (Nantes) / Dans vos locaux / Classe à distance
Formateur
Consultant JavaScript Web et Mobile, avec une vision très opérationnelle, en tant que développeur expérimenté d'applications mobiles Cross-Platforms.
Personnes en situation de handicap
Nos formations sont accessibles aux personnes en situation de handicap. Afin de nous permettre d’organiser le déroulement de la formation dans les meilleures conditions possibles, contactez-nous. Un entretien avec notre référent.e handicap pourra être programmé afin d’identifier les besoins et aménagements nécessaires.
Programme et catalogue peuvent être envoyés sur simple demande
Questions fréquentes
Quelle est la différence entre l'App Router et le Pages Router de Next.js ?
Le Pages Router est l'ancien système de routing de Next.js basé sur le dossier /pages, tandis que l'App Router, introduit à partir de la version 13, repose sur le dossier /app et apporte les Server Components, des layouts imbriqués et une gestion plus fine du rendu. La formation explique pourquoi migrer vers l'App Router et couvre exclusivement cette nouvelle approche.
Quelle est la différence entre SSR, SSG et ISR ?
Le SSR (Server-Side Rendering) génère la page à chaque requête côté serveur. Le SSG (Static Site Generation) génère la page une fois au moment du build. L'ISR (Incremental Static Regeneration) combine les deux en régénérant des pages statiques à intervalles définis. La formation détaille ces trois approches ainsi que le Client Rendering dans un module dédié.
Qu'est-ce qu'une Server Action dans Next.js ?
Une Server Action est une fonction exécutée côté serveur directement appelable depuis un composant React, notamment pour traiter des formulaires sans passer par une API REST classique. La formation propose un atelier pratique de création d'un formulaire dynamique avec validation Zod utilisant une Server Action.
Faut-il déjà connaître React avant cette formation ?
Une connaissance de base en HTML, JavaScript et CSS est nécessaire, et une connaissance préalable de React est un plus pour suivre plus facilement la formation, Next.js étant un framework construit sur React.
Cette formation est-elle éligible au financement OPCO ?
Oui. Bewizyu est un organisme de formation certifié Qualiopi. La formation Next.js est éligible à une prise en charge par votre OPCO. Contactez-nous pour obtenir un devis et un accompagnement dans vos démarches de financement.
La formation peut-elle se faire à distance ?
Oui. La formation est disponible en présentiel au centre Bewizyu de Nantes, dans vos locaux en intra-entreprise, ou en classe virtuelle à distance.
Prérequis recommandé
Next.js repose sur React. Si vous n'avez pas encore de pratique de React :
Dates des prochaines sessions
Mai
Du 05/5/26 au 07/5/26
Centre de Nantes / Classe à Distance
Septembre
Du 16/9/26 au 18/9/26
Centre de Nantes / Classe à Distance
Novembre
Du 18/11/26 au 20/11/26
Centre de Nantes / Classe à Distance