Next.js

Next.js — performance, SEO et mise en production

Optimisez une application Next.js : métadonnées, streaming, découpage client et surveillance après déploiement.

Commencer le cours

15 leçons · 5 h 17 · Niveau avance · 100 % gratuit

Ce que vous saurez faire

  • Générer les métadonnées, Open Graph et JSON-LD par route
  • Diffuser le rendu progressivement avec Suspense et le streaming
  • Réduire le JavaScript client au strict nécessaire
  • Déployer puis mesurer les performances réelles des utilisateurs

Prérequis

  • Maîtriser les composants serveur et le cache Next.js
  • Savoir lire un rapport Lighthouse et un waterfall réseau
Le fil rouge du cours

la mise en ligne du catalogue de randonnées : métadonnées par itinéraire, flux de rendu progressif et suivi des performances

Programme

1 Établir une base de performance mesurable 3 leçons
  1. Choisir les indicateurs à suivre 8 min
  2. Mesurer l’état initial d’une route 25 min
  3. Fixer un budget de JavaScript client 12 min
2 Générer des métadonnées par itinéraire 3 leçons
  1. Définir les métadonnées de chaque itinéraire 20 min
  2. Ajouter les aperçus Open Graph 20 min
  3. Décrire un itinéraire en JSON-LD 20 min
3 Diffuser les pages progressivement 3 leçons
  1. Délimiter les zones d’attente avec Suspense 20 min
  2. Créer des états de chargement utiles 15 min
  3. Vérifier le streaming dans le navigateur 12 min
4 Réduire le JavaScript exécuté côté client 3 leçons
  1. Déplacer l’affichage en composants serveur 25 min
  2. Réserver les composants client aux interactions 35 min
  3. Charger à la demande une fonctionnalité secondaire 20 min
5 Projet pratique : mettre en ligne et surveiller le catalogue 3 leçons
  1. Assembler les routes et les contrôles de qualité 25 min
  2. Déployer le catalogue et comparer les résultats 35 min
  3. Suivre les performances des utilisateurs réels 25 min

Validation du cours

Un quiz de 12 questions vérifie que le parcours est acquis. Il faut 80 % de bonnes réponses pour valider le cours. Les tentatives sont illimitées, seul le meilleur score est conservé.

Passer le quiz

Envie d'aller plus loin ?

Les cours Enovatic sont gratuits et le resteront. Si vous cherchez un accompagnement encadré, nos formations professionnelles sont animées par les mêmes formateurs.

Voir les formations +32 (0) 484 29 56 94