TRA Travailleurs

Next.js

Boostez vos applications React avec le rendu côté serveur et la génération statique

Next.js est un Framework React qui simplifie la création d'applications web performantes, optimisées pour le référencement et offrant une expérience utilisateur exceptionnelle. En combinant la puissance de React avec des fonctionnalités avancées telles que le rendu côté serveur (SSR) et la génération statique (SSG), Next.js vous permet de développer des sites web rapides, interactifs et faciles à référencer.

Propulsez vos applications React vers de nouveaux sommets

Cette formation de 3 jours vous emmène au cœur de Next.js, en vous guidant à travers ses concepts clés et ses fonctionnalités les plus puissantes. Vous apprendrez à créer des applications multipages avec une navigation fluide, à optimiser les performances de chargement grâce au SSR, et à générer des pages statiques pour un référencement optimal. Vous découvrirez également comment gérer l'état de vos composants de manière efficace et déployer votre application Next.js sur différentes plateformes d'hébergement.

Que vous soyez un développeur React expérimenté ou que vous souhaitiez découvrir les avantages de Next.js, cette formation vous donnera les clés pour créer des applications web modernes, rapides et optimisées pour le référencement.

3 jours

Durée de la formation

icone de date ligne courbe
icone de date ligne courbe

Début de la formation

icone de cible

Objectifs de la formation

Au terme de cette formation, le participant sera capable de :

  • Comprendre Next.js : Expliquer les principes fondamentaux de Next.js, son rôle dans la création d'applications web React performantes, et ses avantages par rapport aux autres frameworks.
  • Créer des applications web modernes : Utiliser les fonctionnalités avancées de Next.js, telles que le routage basé sur le système de fichiers, le pré-rendu côté serveur (SSR), la génération statique incrémentielle (ISR), et l'optimisation automatique des images, pour construire des applications web rapides, réactives et optimisées pour le référencement (SEO).
  • Utiliser le routage et la gestion de l'état : Implémenter un système de navigation efficace dans une application Next.js en utilisant le routage basé sur le système de fichiers, et gérer l'état de l'application de manière centralisée ou distribuée en utilisant des solutions telles que Context API, Redux ou Zustand.
  • Comprendre le SSR et l'ISR : Expliquer les concepts de Server-Side Rendering (SSR) et d'Incremental Static Regeneration (ISR), et choisir la stratégie de rendu appropriée en fonction des besoins de l'application pour optimiser les performances et l'expérience utilisateur.
  • Déployer des applications Next.js : Déployer une application Next.js sur différents environnements, tels que des serveurs traditionnels, des plateformes cloud (Vercel, Netlify, etc.) ou des services d'hébergement statique, en configurant correctement le processus de déploiement et en optimisant la livraison des fichiers.

Points forts de la formation

  • Approche pratique et concrète : exercices et projets pour appliquer les concepts théoriques et développer vos compétences.
  • Fonctionnalités avancées : maîtrise du SSR, de l'ISR (Incremental Static Regeneration) et du routage pour des applications performantes.
  • Optimisation des performances et du référencement : techniques et bonnes pratiques pour améliorer la visibilité de votre site web.
  • Gestion de l'état : apprenez à utiliser les Hooks React et le contexte pour une gestion efficace de l'état de vos composants.
  • Déploiement : découvrez comment déployer votre application Next.js sur différentes plateformes.
image point fort

Programme
de la formation

  • Module 1 : Introduction à Next.js et Fondamentaux
    • Introduction à Next.js
    • Présentation de Next.js et ses avantages par rapport à React
    • Configuration de l'environnement de développement
    • Création d'un projet Next.js et structure de base
    • Routage avec Next.js
    • Système de routage intégré
    • Création de pages dynamiques avec paramètres de route
    • Routage client-side vs. server-side
    • Gestion de l'État dans Next.js
    • Utilisation de React Hooks pour l'état local
    • Partage de l'état entre les pages avec les gestionnaires de contexte
    • Gestion de l'état côté client (getServerSideProps, getStaticProps)
  • Module 2 : Server-Side Rendering et Déploiement
    • Server-Side Rendering (SSR) avec Next.js
    • Comprendre le SSR et ses avantages
    • Utilisation de getServerSideProps pour le rendu côté serveur
    • Mise en œuvre de SSR pour les performances et le référencement
    • Incremental Static Regeneration (ISR)
    • Comprendre l'ISR et son utilisation
    • Génération statique des pages avec ISR
    • Configuration de la mise en cache et des délais de régénération
    • Déploiement d'une Application Next.js
    • Génération de fichiers de production
    • Hébergement sur différentes plateformes (Vercel, Netlify, etc.)
    • Stratégies de déploiement pour une mise à jour en douceur
  • Module 3 : Exercices pratiques
    • Création d'une application multi-pages avec navigation
    • Gestion de l'état local des composants avec des Hooks
    • Utilisation du contexte pour partager des données entre les pages
    • Implémentation de Server-Side Rendering
    • Utilisation d'Incremental Static Regeneration
    • Déploiement d'une application Next.js
image ligne principale image ligne secondaire

Personne de contact

Magali Gerard

Magali Gerard

Assistante administrative Entreprises

+32 71 25 49 60 [email protected]

Formateur :

La société CogniTIC est active dans les domaines de la consultance, du développement et de la formation en systèmes d’information. Tous les collaborateurs de CogniTIC mettent à profit leur expérience en tant que développeur, architecte logiciel, analyste métier, responsable qualité ou chef de projet pour proposer des formations méthodologiques et technologiques en fonction des besoins des entreprises et des réalités du marché.