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-router-7 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 https://youtu.be/SfTfRPAR50c Développe 2X plus vite avec cette stack Remix https://www.youtube.com/watch?v=yv96ar6XNnU&list=PL2TfCPpDwZVTQr3Ox9KT0Ex2D-QajUyhM&index=1 BiomeJS, l'outil qui optimise ton code https://youtu.be/Ln3rpyhVpZs --- Contenu React Router / Remix Comment héberger des fichiers avec Remix ? https://youtu.be/c7nLBwfg_K8 Comment valider un formulaire full-typesafe ? https://youtu.be/_-ZOGj80TMw Comment fonctionne le routing ? https://youtu.be/TOMMXhgUQfI 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 : https://www.tiktok.com/@algomaxcode