Développer des applications web avec NextJS

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