Crée ta première app NextJS 15 : App Router, React Server Components & Server Actions

Dans cette vidéo, on découvre ensemble Next.js v15 avec l'App Router, les React Server Components, Server Actions et Prisma ORM (avec base de donnée SQLite). On consomme l’API TheMovieDB, validée avec Zod, et on intègre l'authentification. (login, signup, cookies, routes protégées). Stack technique: Next.js 15 Tailwind CSS TypeScript React Server Components Server Actions App Router Turbopack Prisma SQLite TheMovieDB API Zod Authentification avec cookies UI optimiste avec useOptimistic et useTransition Code source : https://github.com/varkoff/movie-picker Envie de maîtriser React Router 7 ? Tu vas adorer ma dernière formation "React Router 7". Dedans, je t'accompagne et t'aide à maîtriser les bases de ce framework puissant, pour que tu puisses développer des sites performants en toute autonomie. L'objectif : Te permettre d'offrir une expérience exceptionnelle à tes utilisateurs grâce à tes compétences de développeur fullstack. Tu retrouveras tout le programme sur le site : https://algomax.fr/formation-react-ro... 1. Introduction à React Router 7 2. Analyse du code React Router 3. Maîtriser le routing dans React Router 7 4. Maîtrise les formulaires dans React Router 7 5. L'authentification dans React Router 7 6. Déploiement d'une application React Router 7 7. Module SEO 8. On développe une application React Router 7 de zéro en intégrant l'IA 9. Module bonus : Tests unitaires 10. Module bonus : Tests end-to-end Documentation officielle : https://reactrouter.com/home --- Deals -10% sur l'abonnement mensuel Strapi Cloud avec le code ALGOMAX : https://dub.sh/strapi-deal -10% aux VPS Hostinger (lien affilié) : https://www.hostinger.fr/algomax (12 mois d'engagement min) ou avec le code ALGOMAX 00:00  Intro & stack (Next 15, RSC, Server Actions, Prisma) 00:35  Initialisation projet (TypeScript, Tailwind CSS, Turbopack) 01:26  Premier run : arbo & scripts npm 02:56  Clé API TheMovieDB & .env 04:31  getMovies() côté serveur (RSC) 06:18  Fix header Authorization: Bearer & helper fetchMovieDB 07:38  Validation avec Zod 10:14  Composant MovieCard + config next.config.js pour image.tmdb.org 14:06  Setup Prisma 6.6 + migration SQLite 16:02  Modèle User, seeding & Prisma Studio 20:31  Page Login & navbar 22:22  Auth server‑side : Server Action loginAction 26:47  Sessions, cookies, redirect, page signup 57:33  Route protégée /history & util requireUser() 68:18  Modèle HistoryItem, UI optimiste (useOptimistic, useTransition) 88:47  Wrap‑up, lien GitHub & déploiement --- Autres contenus Déploie tes projets Javascript sur un VPS    • Comment héberger tes projets JAVASCRIPT su...   Développe 2X plus vite avec cette stack Remix    • Développe 2X plus VITE ! Remix, NestJS, Ty...   BiomeJS, l'outil qui optimise ton code    • Cet outil AMÉLIORE la qualité de ton code ...   --- Contenu React Router / Remix Comment héberger des fichiers avec Remix ?    • Comment héberger des fichiers avec Remix |...   Comment valider un formulaire full-typesafe ?    • Valide ton formulaire avec Remix, Zod et C...   Comment fonctionne le routing ?    • Routing avec le framework Remix : Guide co...   Contenus exclusifs : https://algomax.fr Newsletter : https://algomax.fr/newsletter --- Nos réseaux Twitter : https://link.algomax.fr/twitter LinkedIn : https://link.algomax.fr/linkedin YouTube : https://link.algomax.fr/youtube Instagram : https://link.algomax.fr/insta Facebook : https://link.algomax.fr/fb TikTok :   / algomaxcode