MAÎTRISE NEXTJS 13 : Créer et deploy une app Full-Stack Modern en Juste 4 Heures !
Next.js est un framework JavaScript open source qui vous permet de créer des applications web modernes. Si vous souhaitez apprendre à créer et déployer une application full-stack en seulement 4 heures, alors la maîtrise de Next.js 13 est faite pour vous !
Qu’est-ce que Next.js 13 ?
Next.js 13 est la dernière version de ce puissant framework JavaScript. Il offre des fonctionnalités avancées telles que le rendu côté serveur, la pré-rendition statique, le support de TypeScript, et bien plus encore. Avec Next.js 13, vous pouvez créer des applications web rapides, performantes et modernes en un rien de temps.
Objectifs de la maîtrise Next.js 13
L’objectif de cette maîtrise est de vous apprendre à créer une application full-stack en utilisant Next.js 13. Vous apprendrez à mettre en place un environnement de développement, à structurer votre application, à gérer l’état global, à gérer les routes, à interagir avec une base de données, et enfin à déployer votre application sur le web.
Contenu de la maîtrise
La maîtrise Next.js 13 est composée de plusieurs modules qui couvrent l’ensemble du processus de création et de déploiement d’une application full-stack. Chaque module est conçu pour vous aider à maîtriser une étape spécifique de développement.
- Module 1 : Configuration de l’environnement de développement
- Module 2 : Structuration de l’application avec Next.js
- Module 3 : Gestion de l’état global avec Redux
- Module 4 : Gestion des routes avec Next.js
- Module 5 : Intégration d’une base de données MongoDB
- Module 6 : Déploiement de l’application sur Vercel
Pourquoi choisir cette maîtrise ?
La maîtrise Next.js 13 est conçue pour les développeurs web qui souhaitent apprendre à créer des applications modernes et performantes en un temps record. En suivant cette maîtrise, vous serez en mesure de créer et déployer votre propre application full-stack en seulement 4 heures.
Conclusion
Si vous êtes passionné par le développement web et que vous souhaitez apprendre à créer des applications full-stack modernes en un minimum de temps, alors la maîtrise Next.js 13 est faite pour vous. Rejoignez-nous dès maintenant et commencez à maîtriser Next.js 13 en seulement 4 heures !
Il faut que je précise qu'à l'époque où je faisais la vidéo, les server actions avaient quelques problèmes concernant leur utilisation directement dans les server components.
Depuis, ce problème est résolu et vous n'avez plus besoin de les passer en props.
Désolé pour cela, c'est de la faute à Next.js, hein !
Hello j'ai cette erreur et ne comprend pas pourquoi, lors de l'ajout du themeProvider dans layout :
Warning: Prop `className` did not match. Server: "h-full dark" Client: "h-full"
slt a tous je me suis aperçu sur la video a 2h49 qu'il n'y avait pas de buttonfollow et tu fait une transition a 2h51 et la y a un buttonfollow qui apparait mais que tu ne montre pas ?
Je like et je commente avant que ça ne commence 😅
moi je suis bluffer et je voudrais savoir comment est ce que tu t"es formé? je veux vraiment le savoir stp
Salut Melvynn, le dark mode ne fonctionne. J'ai cette erreur dans la console -> "app-index.js:31 Warning: Extra attributes from the server: class,style
at html at RedirectErrorBoundary" çà vient du dossier node_modules – cà commence bien lol :))
Salut et merci pour ce tuto !
A 19'20 j'ai l'erreur :
index.js:654 Uncaught Error: createContext only works in Client Components. Add the "use client" directive at the top of the file to use it.
Pourtant dans page.tsx et themeprovider j'ai bien 'use client'
Merci d'avance !
Honnêtement je poste rarement des commentaires, mais il faut quand même dire que tes vidéo sont vraiment excellentes. J'ai beaucoup appris sur react en général grâce à tes vidéos ( étant dev back et souhaitant juste compléter mes compétences ), et ce tuto est une fois de plus de qualité. Merci pour ça ❤🔥
il n'a manqué que graphQL
hey bonjour @melvynxdev déjà merci pour cette formation , je rencontre un probleme avec ThemeToggle.tsx les @layer base, ne sont pas pris en charge donc impossible de changer la couleur de fond en light || black cela m'indique que Unknown at rule @applycss(unknownAtRules) dans le globals.css peut tu m'aider merci
Excellent!
Salut Melvyn !
Tout d'abord un grand merci pour cette vidéo, qui donne vraiment envie d'acheter tes cours (je regrette vraiment de pas avoir sauté sur l'occasion dès le début).
Pour parler un peu de Next le capricieux, j'ai fait face à des erreurs ("sans erreurs") bien idiotes !
J'avais des problèmes bien fun avec :
– la route de la modal qui me renvoyait sur une 404 :
=> le fichier default.tsx n'était pas placé dans le dossier parent.
-la modal de reply qui ne voulait pas se fermer et rediriger correctement :
=> J'avais laissé un router.refresh() dans PostLayout.tsx
Et diverses autres étourderies
Par contre petite question, comment fais tu pour afficher les images des avatars provenant de "avatars.githubusercontent.com" et "cloudflare-ipfs.com" pour celles de Faker sans avoir à modifier le next.config.js ?
Sinon, je vais me servir de ce projet comme base pour y apporter quelques modifications :
– un éditeur wysiwyg pour les posts ( à voir si j'inclus les images ou pas )
– incorporer la petite bar sur la gauche des posts sous l'avatar
– une gestion de hashtag, moteur de recherche
Etc.. il y a tellement de choses possibles !
Merci à toi pour cette bonne humeur et ce savoir partagé !
Cool s'il y a une version du tutoriel en js 😁En tous cas, super tuto 🙂
Super vidéo 🙂
Hello pour ancer l'appli j'ai mis npm run dev mais ca me génère une erreur
En toute objectivité tes la meilleure chaîne React et Next on sans l'amour et l'effort et la qualité Continue si les autres framework fr pouvez avoir aussi ca
J'ai suivi la première partie sur le thème et les éléments de base mais j'ai quelques soucis. Apparemment certaines classes tailwind ne fonctionnent pas et de même pour le darkmode. Un avertissement apparait aussi dans la console concernant les attributs de la balise html :/
J'attendais impatiemment cette formation
like numero 100
Nice