Sorry, this page is no longer available
We may earn an affiliate commission when you visit our partners.
Course image
DONKEYGEEK Tahar

Bienvenue dans la formation qui vous permettra de maîtriser Next.js App Router par la pratique, tout en suivant les conseils et recommandations de ses créateurs, Vercel.

Cette formation, entièrement en français, est conçue pour vous guider pas à pas dans l’apprentissage des concepts clés de Next.js App Router. Que vous soyez débutant ou développeur confirmé, elle vous permettra de monter en compétences et de rester à la pointe de la technologie.

Pourquoi apprendre Next.js ?

Read more

Bienvenue dans la formation qui vous permettra de maîtriser Next.js App Router par la pratique, tout en suivant les conseils et recommandations de ses créateurs, Vercel.

Cette formation, entièrement en français, est conçue pour vous guider pas à pas dans l’apprentissage des concepts clés de Next.js App Router. Que vous soyez débutant ou développeur confirmé, elle vous permettra de monter en compétences et de rester à la pointe de la technologie.

Pourquoi apprendre Next.js ?

- L’évolution de React: Désormais, les compétences en React ne suffisent plus. Cela est parfaitement corroboré par les créateurs de React.js qui, recommandent l'utilisation de React avec les méta-frameworks comme Next.js. L’abandon de "Create React App" par ces mêmes créateurs de React est une autre indication sur le virage que prend React pour les années à venir et qui consiste à devenir une simple dépendance de Next.js.

- Des applications web Fullstack performantes : Next.js est le framework incontournable pour créer des applications web modernes, rapides et performantes. Il offre un ensemble de fonctionnalités avancées comme le routage, le rendu côté serveur, l'optimisation des performances, et bien plus encore, pour développer des projets robustes et optimisés.

- Un avantage concurrentiel: Les recruteurs recherchent des développeurs maîtrisant Next.js pour leurs projets. En vous formant à Next.js App Router, vous boosterez votre carrière et augmenterez vos opportunités professionnelles pour les années à venir.

Déroulement de la formation

1. Introduction et présentation d'un projet Next.js.

2. Initialisation d’un projet avec App Router.

3. Travaux pratiques : Styling, Routage, codage d'une application

4. Rendu statique et rendu dynamique.

5. Plusieurs exercices sur les Actions Serveur et leurs implémentations.

6. Optimisation et déploiement sur Vercel.

7. Concepts avancés : Streaming, hooks personnalisés, recherche, pagination, la gestion des erreurs, authentification, l'accessibilité, les métadatas et bien plus encore.

Voici un aperçu des différents sujets abordés dans cette formation:

- Routage avancé avec App Router : Initialisation de projets, gestion des layouts, routes statiques et dynamiques, navigation entre pages.

- Composants côté serveur et côté client: Découvrez les "Server Components" et "Client Components" et apprenez à les utiliser efficacement.

- Optimisation des performances : Gestion des images, polices, icônes et autres techniques d’amélioration des performances.

- Rendu statique et dynamique : Maîtrisez les différences et apprenez à utiliser le streaming pour vos projets.

- Gestion des bases de données : Travaux pratiques avec MongoDB, Prisma, SQL, et NoSQL pour des applications complètes codées de A à Z.

- Authentification et sécurité : Implémentation de NextAuth, protection des routes et hachage des mots de passe.

- Déploiement : Mettez en ligne vos applications sur Vercel, la plateforme créée par les auteurs de Next.js, et bien plus encore.

- Pour plus de renseignement, regardez la vidéo de présentation.

Ce que vous gagnerez à la fin de cette formation

- Une maîtrise complète de Next.js App Router.

- La capacité de travailler sur des projets modernes en entreprise.

- Des bases solides pour devenir un développeur Fullstack.

- Et une longueur d’avance sur le marché du travail par rapport aux simples développeurs React ;-)

Pourquoi choisir cette formation ?

- Pédagogie claire et didactique : Chaque concept est expliqué en détail avec des exemples concrets, des visuels et des exercices pratiques.

- Projets réels : Nous allons travailler sur deux applications complètes, ainsi qu'un gros projet recommandé par Vercel pour l'apprentissage de Next.js App Router.

- Évaluations: Plusieurs Quiz sont prévus pour évaluer les connaissances acquises tout au long de la formation.

- Support de cours complet et ressources : Plus de 80 pages en PDF contenant des explications, des diagrammes et des ressources utiles accessible en téléchargement + les trois applications codées dans la formations.

- Formateur expérimenté et développeur Senior avec plusieurs années d'expérience.

Prérequis

- Connaissances de base en

- Notions fondamentales en React.js.

Outils Indispensables:

- Un éditeur de code comme Visual Studio Code.

- Une version récente de Node.js installée.

- Un navigateur web à jour (Google chrome)

- Une connexion Internet

Voilà les amis, une nouvelle ère où React.js ne suffit plus vient de démarrer. Désormais, vous devez absolument maîtriser Next.js, non seulement pour être à jour dans vos connaissances, mais aussi pour pouvoir continuer à être compétitif sur le marché du travail et opérationnel en entreprise.

Si vous êtes déterminés à monter en compétence sur une vraie technologie d'avenir, rejoignez moi dans cette nouvelle formation à la découverte de la récente version Next.js pour devenir un véritable développeur Fullstack de premier choix. Celui-là même que les recruteurs s'arrachent massivement en ce moment même.

Démarrez votre apprentissage et positionnez-vous comme un développeur de premier choix .

PS : Pensez à regarder la vidéo de promotion pour obtenir un aperçu global des différents chapitres et sujets abordés dans cette formation.

Enroll now

What's inside

Learning objectives

  • Maîtriser la nouvelle version next js app router
  • Maîtriser les concepts de la récente version next js par la théorie et la pratique
  • Maîtriser les nouveaux concepts de next js en suivant les recommandations de ses créateurs (vercel)
  • Apprendre next js pour devenir un développeur d'applications web full stack
  • Apprendre next js de a à z en codant 3 applications, étape par étape.
  • Maîtriser les soumissions de données via les actions serveur (server actions)
  • Maîtriser les composants serveur, les composants client, la récupération de données et plus encore !
  • Explorer toutes les fonctionnalités clés de nextjs telles que le pré-rendu, le ssr, la récupération de données, le routage, l'authentification et plus encore ..
  • Optimisation des polices d'écriture, des images et des icônes dans des exercices pratiques
  • Maîtriser les layouts, les layouts imbriqués, les routes statiques, les routes dynamiques, les routes dynamiques imbriquées avec catch all segments
  • Maîtriser la gestion des erreurs, la fonction not-found, la colocation de fichiers dans un projet next
  • Maîtriser les dossiers privés et les groupes de routes dans les projets nextjs
  • Maîtriser navigation, les formulaires, les images, et les images d'arrière plan dans une application next
  • Maîtriser plusieurs hooks utiles comme usedebouncedcallback, usesearchparams, useformstate, etc
  • Le déploiement d'un projet nextjs sur les services de vercel
  • La configuration des bases de données sql (postgresq), nosql (mongodb) et comment les utiliser dans un projet nextjs
  • Maîtriser les routes handlers avec des exercices pratiques
  • Maîtriser les paramètres de requête, la redirection automatique, la modification, la suppression de data, les requêtes en cascade, les requêtes parallèles, etc
  • Comprendre le rendu statique versus le rendu dynamique, leurs usages et comment passer de l'un à l'autre
  • Comprendre le streaming dans nextjs. streaming d'une page conjointement avec les skeleton. le streaming d'un composant avec suspense
  • Maîtriser le regroupement de composants dans nextjs
  • La recherche avec des paramètres d'url et avec synchronisation des inputs
  • Maîtriser l'accessibilité dans un projet nextjs notamment pour les besoins des technologies d'assistance
  • Show more
  • Show less

Syllabus

Introduction
Adapter la formation à votre rythme
Ressources en téléchargement
dans cette section, on verra comment initialiser un projet Next.js et comprendre les différents éléments qui le composent.
Read more

Traffic lights

Read about what's good
what should give you pause
and possible dealbreakers
Teaches Next.js App Router, which is increasingly becoming an essential skill for modern web development, especially for those with React experience
Explores server components and client components, which are key concepts for building efficient and interactive user interfaces in Next.js applications
Covers deployment on Vercel, which is created by the authors of Next.js, making it a streamlined and optimized platform for Next.js applications
Includes hands-on exercises with MongoDB, Prisma, SQL, and NoSQL, providing practical experience with different database technologies in Next.js projects
Requires basic knowledge of React.js, so learners without this background may need to acquire it before taking this course
Focuses on Next.js App Router, which is a relatively new technology, so learners should be aware that the landscape of best practices and community support may still be evolving

Save this course

Create your own learning path. Save this course to your list so you can find it easily later.
Save

Reviews summary

Maîtrise pratique de next.js app router

Selon les apprenants, cette formation offre une maîtrise complète et pratique de Next.js App Router. De nombreux étudiants soulignent la qualité de la pédagogie et les explications très claires du formateur, qui rend les concepts complexes faciles à comprendre. Le côté très pratique avec la réalisation de plusieurs applications complètes est unanimement apprécié et permet de vraiment mettre en pratique les notions apprises. La formation est considérée à jour avec la version 2025 et les recommandations de Vercel, ce qui est essentiel pour les professionnels. Quelques commentaires indiquent qu'avoir des notions de base en React est nécessaire pour suivre efficacement. Dans l'ensemble, un excellent investissement pour monter en compétence.
Prérequis en React.js essentiels
"Il faut vraiment avoir des bases solides en React pour suivre le rythme, ce n'est pas pour les débutants complets."
"Attention, si vous débutez en React, ce cours pourrait être difficile à aborder sans préparation."
"Bien que le cours soit très bon, les prérequis en React sont importants pour ne pas être perdu rapidement."
Aborde Next.js App Router de A à Z
"Le cours couvre tous les aspects essentiels de l'App Router, c'est très complet."
"On passe en revue toutes les fonctionnalités importantes, de l'authentification au déploiement."
"J'ai trouvé que le programme était bien structuré et abordait une large gamme de sujets."
L'instructeur est compétent et patient
"Le formateur est un expert, ça se sent dans ses explications et sa maîtrise du sujet."
"Très bon instructeur, clair et précis, on voit qu'il a de l'expérience."
"Merci au formateur pour sa patience et ses explications détaillées."
"La qualité du formateur est un atout majeur de ce cours."
Couvre la dernière version App Router 2025
"Super formation, bien à jour sur App Router et les dernières pratiques recommandées par Vercel."
"C'est exactement ce que je cherchais, un cours sur la version actuelle de Next.js, pas obsolète."
"Ravi de voir un cours qui suit les évolutions rapides de Next.js 14+."
Explications très faciles à comprendre
"La pédagogie est top, le formateur explique très bien les concepts difficiles de Next.js."
"Merci pour la clarté des explications, tout est limpide, même les points techniques."
"Même les sujets complexes sont rendus accessibles grâce à la manière d'enseigner."
"J'apprécie la clarté et la précision des vidéos, on ne se sent jamais perdu."
Permet de coder de vraies applications complètes
"Le point fort de cette formation est clairement le côté pratique, on code de vraies applications."
"J'ai beaucoup aimé construire les projets étape par étape, ça m'a vraiment aidé à assimiler."
"Pouvoir mettre en pratique sur des cas concrets est un énorme plus, indispensable pour maîtriser."
"Les travaux pratiques sont bien choisis et couvrent les aspects essentiels."

Activities

Be better prepared before your course. Deepen your understanding during and after it. Supplement your coursework and achieve mastery of the topics covered in Maîtrisez Next.js App Router par la pratique | 2025 | 22h with these activities:
Réviser les bases de React.js
Renforcer les connaissances fondamentales en React.js pour mieux appréhender les concepts avancés de Next.js App Router.
Browse courses on React.js
Show steps
  • Revoir la documentation officielle de React.js.
  • Effectuer des exercices pratiques sur les composants et les hooks.
  • Consulter des tutoriels vidéo pour consolider les bases.
Consulter la documentation de Vercel
Se familiariser avec la plateforme de déploiement recommandée pour Next.js.
Show steps
  • Explorer la documentation sur le déploiement de Next.js.
  • Comprendre les options de configuration et d'optimisation.
  • Suivre les tutoriels de déploiement pas à pas.
Lire 'Next.js in Action'
Approfondir la compréhension de Next.js avec un guide complet et pratique.
Show steps
  • Lire les chapitres pertinents sur le routage et le rendu.
  • Expérimenter avec les exemples de code du livre.
  • Prendre des notes sur les concepts clés.
Four other activities
Expand to see all activities and additional details
Show all seven activities
Exercices sur les Server Actions
Renforcer la maîtrise des Server Actions à travers des exercices ciblés.
Show steps
  • Créer un formulaire simple avec une Server Action pour la soumission des données.
  • Implémenter la validation des données côté serveur.
  • Gérer les erreurs et afficher des messages d'erreur appropriés.
Créer un blog personnel avec Next.js App Router
Mettre en pratique les connaissances acquises en développant un projet concret et complet.
Show steps
  • Concevoir la structure du blog et les fonctionnalités principales.
  • Implémenter le routage, les composants et la gestion des données.
  • Déployer le blog sur Vercel.
Rédiger un article de blog sur Next.js App Router
Consolider la compréhension en expliquant les concepts clés à d'autres développeurs.
Show steps
  • Choisir un sujet spécifique lié à Next.js App Router.
  • Rédiger un article clair et concis avec des exemples de code.
  • Publier l'article sur un blog personnel ou une plateforme communautaire.
Contribuer à un projet Open Source Next.js
Approfondir les compétences en collaborant avec d'autres développeurs sur un projet réel.
Show steps
  • Identifier un projet Open Source Next.js sur GitHub.
  • Étudier le code source et la documentation du projet.
  • Contribuer en corrigeant des bugs, en ajoutant des fonctionnalités ou en améliorant la documentation.

Career center

Learners who complete Maîtrisez Next.js App Router par la pratique | 2025 | 22h will develop knowledge and skills that may be useful to these careers:
Développeur Full Stack
Un développeur full stack travaille à la fois sur le front end et le back end d'une application, prenant part à la création de la base de données jusqu'à l'interface utilisateur. Ce cours est spécialement conçu pour ceux qui veulent devenir développeur full stack, car il fournit les connaissances nécessaires pour utiliser Next.js dans des projets complets. En apprenant le routage avancé, la gestion des bases de données avec MongoDB, Prisma, SQL, et NoSQL, ainsi que l'authentification, ce cours donne au développeur full stack les outils pour créer des applications robustes et optimisées. Les exercices pratiques et les projets réels permettent de mettre en application les concepts étudiés. Si vous voulez exceller en tant que développeur full stack, ce cours sera un atout précieux.
Développeur front-end
Un développeur front end se concentre sur l'interface utilisateur, construisant des sites web et des applications interactives. Ce cours est idéal pour un développeur front end souhaitant maîtriser Next.js App Router, car il offre une formation pratique sur les aspects essentiels tels que le routage avancé, les composants côté serveur et client, et l'optimisation des performances. La formation met l'accent sur les exercices pratiques et les projets réels, permettant au développeur front end d'acquérir une expertise concrète. Ce cours vous permettra de développer des applications web modernes et performantes, en utilisant les dernières fonctionnalités de Next.js.
Développeur React
Un développeur React se spécialise dans le développement d'interfaces utilisateur en utilisant la bibliothèque React. Ce cours est pertinent pour un développeur React qui souhaite aller au-delà des bases de React et maîtriser Next.js. En se familiarisant avec les concepts tels que le routage avancé, les composants côté serveur et client, et l'optimisation des performances, un développeur React peut créer des applications web plus performantes et évolutives. Le cours offre des exercices pratiques et des projets concrets, ce qui permet d'appliquer les connaissances acquises et de progresser vers le développement full stack. Si vous êtes développeur React et souhaitez devenir un développeur de premier choix, ce cours est pour vous.
Ingénieur logiciel
Un ingénieur logiciel est un professionnel qui conçoit, développe et maintient des systèmes logiciels. Ce cours peut être utile pour un ingénieur logiciel, car il couvre les aspects essentiels de Next.js App Router, en mettant l'accent sur le développement d'applications robustes et optimisées. En utilisant les fonctionnalités avancées comme le rendu côté serveur, l'optimisation des performances, et la gestion des bases de données mentionnée dans ce cours, un ingénieur logiciel peut améliorer ses compétences. Les exercices pratiques et les projets réels fournis dans le cours apportent une expérience concrète. Un ingénieur logiciel qui souhaite rester à la pointe de la technologie peut trouver une grande valeur dans ce cours.
Consultant en Développement Web
Un consultant en développement web fournit des conseils et des solutions aux entreprises sur la technologie à employer pour le développement web. Ce cours est utile pour un consultant en développement web en raison de la maitrise approfondie de Next.js App Router. En se formant sur les concepts avancés, comme le routage, le rendu côté serveur, l'optimisation des performances et la gestion des bases de données, le consultant en développement web peut recommander des solutions basées sur les dernières technologies. Ce cours permet de proposer des stratégies innovantes et efficaces pour le développement d'applications web modernes. La capacité à travailler sur des projets réels donne une base solide d'expérience pratique.
Spécialiste en Optimisation Web
Un spécialiste en optimisation web se concentre sur l'amélioration des performances des sites web. Ce cours est particulièrement utile pour un spécialiste en optimisation web, car il aborde en détail les techniques d'optimisation des performances dans Next.js, incluant la gestion d'images, de polices et d'icônes. Ce cours permet d'implémenter des stratégies de rendu statique et dynamique, qui sont importantes pour la performance. Un spécialiste en optimisation web apprendra aussi le streaming, une technique importante pour améliorer les temps de chargement. Les pratiques fournies par ce cours permettront d'améliorer considérablement les performances des applications web développées avec Next.js App Router.
Architecte Web
Un architecte web conçoit la structure des systèmes web, assurant leur évolutivité, leur performance et leur sécurité. La formation sur Next.js App Router peut être utile pour un architecte web, car elle traite des aspects essentiels de la construction d'architectures web modernes. La maîtrise du routage avancé, du rendu côté serveur, de l'optimisation des performances et de la gestion des bases de données, couverts dans ce cours, permet à l'architecte web de concevoir des solutions robustes et efficaces. Les connaissances acquises peuvent aider l'architecte web à prendre des décisions éclairées sur le choix des technologies et des meilleures pratiques pour la construction d'applications web complexes.
Formateur Développeur Web
Un formateur développeur web enseigne les concepts et les technologies du développement web. Ce cours est pertinent pour un formateur en développement web qui souhaite se spécialiser dans Next.js App Router. La formation permet de maîtriser les concepts avancés, les meilleures pratiques et les dernières fonctionnalités de Next.js, tels que le routage, le rendu côté serveur, et l'optimisation des performances. Grâce à ce cours, un formateur peut fournir des formations de qualité basées sur une expérience pratique, en utilisant les exercices et les projets réels du cours pour l'enseignement. La maîtrise de ce framework permet au formateur de se positionner comme un expert et d'offrir des contenus de pointe.
Responsable Technique
Un responsable technique encadre les équipes de développement et prend des décisions techniques pour les projets web. La formation sur Next.js App Router est pertinente pour un responsable technique, car elle fournit une compréhension approfondie du framework. En maîtrisant le routage avancé, le rendu côté serveur, l'optimisation des performances, et la gestion des bases de données, un responsable technique peut guider ses équipes avec plus d'efficacité et de confiance. Ce cours fournit une connaissance technique à jour qui permet aux responsables techniques de prendre des décisions plus éclairées et de mieux gérer les projets web, et de comprendre les challenges techniques de leurs équipes.
Chef de projet web
Un chef de projet web gère les projets de développement web, de la planification à la livraison. Ce cours peut être utile pour un chef de projet web pour acquérir une compréhension technique de Next.js App Router. En se familiarisant avec les concepts clés tels que le routage, les composants côté serveur, le rendu statique et dynamique, et l'optimisation des performances, un chef de projet web peut mieux communiquer avec les développeurs, planifier les étapes du projet, et anticiper les défis techniques. Les connaissances acquises dans ce cours lui permettent de prendre des décisions éclairées pour la gestion des ressources et du temps. Ce cours peut aider à mieux comprendre et communiquer avec son équipe de développeurs.
Intégrateur web
Un intégrateur web transforme des maquettes graphiques en code HTML, CSS et JavaScript. Ce cours peut être utile pour un intégrateur web qui souhaite s'initier au développement avec Next.js App Router. En se familiarisant avec les principes de base de Next.js, les composants côté serveur et client, et l'optimisation des performances, un intégrateur web peut acquérir des compétences supplémentaires pour créer des applications web dynamiques et interactives. Ce cours peut aider l'intégrateur à évoluer vers un rôle de développeur front end. Le cours peut lui ouvrir la porte aux frameworks plus complexes.
Testeur de Logiciel
Un testeur de logiciel assure la qualité des applications en identifiant les bugs et les erreurs. Ce cours peut être utile pour un testeur de logiciel souhaitant comprendre Next.js App Router. Il permet de mieux appréhender les concepts de développement et de comprendre l'architecture des applications web créées avec ce framework. La connaissance du routage avancé, des composants côté serveur et client, ainsi que des techniques de gestion des erreurs vues dans le cours, améliore la capacité du testeur à élaborer des tests plus pertinents et à mieux identifier les problèmes potentiels. Un testeur de logiciel peut utiliser ce cours pour mieux comprendre les outils et technologies mis en place par les développeurs.
Concepteur d'interface utilisateur
Un concepteur d'interface utilisateur crée des interfaces intuitives et attrayantes pour les applications web. Bien que ce cours ne soit pas spécifiquement axé sur la conception, il peut être utile pour un concepteur d'interface utilisateur car celui-ci à besoin de comprendre comment une interface est mise en œuvre. Cette connaissance du fonctionnement de Next.js permet au concepteur d'interface utilisateur de mieux comprendre les possibilités et les contraintes techniques lors de la conception. Le concepteur d'interface peut alors optimiser son travail.
Rédacteur technique
Un rédacteur technique crée de la documentation pour des produits techniques. Ce cours peut être utile à un rédacteur technique qui travaille dans le domaine du développement web. La connaissance de Next.js App Router, incluant les différents concepts techniques et le processus de développement, peut aider le rédacteur technique à produire une documentation plus précise et plus complète. La formation permet de comprendre en détail chaque aspect du framework, ce qui est essentiel pour rédiger une documentation de qualité. En acquérant ces connaissances, le rédacteur technique améliorera ses compétences dans la création de guides et de manuels pour les développeurs. L'expérience pratique acquise avec les différents projets peut également lui donner une perspective unique.
Analyste de données
Un analyste de données examine et interprète les données pour aider à la prise de décision. Bien que ce cours ne soit pas directement lié à l'analyse des données, il peut être utile pour un analyste de données qui travaille dans une équipe de développement web. La connaissance de Next.js App Router, incluant la gestion de bases de données, peut permettre à l'analyste de comprendre comment les données sont structurées et utilisées au sein d'une application web. La compréhension du fonctionnement d'une application web peut améliorer la communication avec les développeurs. Cela peut aider l'analyste à extraire et à interpréter les données plus efficacement.

Reading list

We've selected one books that we think will supplement your learning. Use these to develop background knowledge, enrich your coursework, and gain a deeper understanding of the topics covered in Maîtrisez Next.js App Router par la pratique | 2025 | 22h.
Ce livre offre une exploration approfondie de Next.js, couvrant des sujets allant du rendu côté serveur à l'optimisation des performances. Il est particulièrement utile pour comprendre les meilleures pratiques et les modèles de conception pour les applications Next.js. Il fournit un contexte précieux pour les concepts abordés dans le cours et sert de référence complète pour les développeurs Next.js.

Share

Help others find this course page by sharing it with your friends and followers:

Similar courses

Similar courses are unavailable at this time. Please try again later.
Our mission

OpenCourser helps millions of learners each year. People visit us to learn workspace skills, ace their exams, and nurture their curiosity.

Our extensive catalog contains over 50,000 courses and twice as many books. Browse by search, by topic, or even by career interests. We'll match you to the right resources quickly.

Find this site helpful? Tell a friend about us.

Affiliate disclosure

We're supported by our community of learners. When you purchase or subscribe to courses and programs or purchase books, we may earn a commission from our partners.

Your purchases help us maintain our catalog and keep our servers humming without ads.

Thank you for supporting OpenCourser.

© 2016 - 2025 OpenCourser