How I Migrated Next.js to React Router and TanStack

Today we go over how to migrate from Next.js to TanStack Start or React Router v7. Next.js original repo: https://github.com/TheOrcDev/noteforge Migrated repo: https://github.com/forge-42/note-forge-react-router TanStack guide: https://tanstack.com/start/latest/docs/framework/react/migrate-from-next-js Migration livestream: https://youtube.com/live/0nH7kpXShys I am also an epic-instructor on Epic Web, if you're interested in my upcoming react-router courses feel free to subscribe to the newsletter here to make sure to not miss any updates: https://www.epicweb.dev/newsletter 👍 Don't forget to like, comment, and subscribe for more episodes in this series! Join our coding community and let's build something amazing together. 📌 Stay Connected: Twitter: https://twitter.com/AlemTuzlak GitHub: https://github.com/AlemTuzlak Company Github: https://github.com/forge-42 ⏱️ Timestamps: 00:00 - intro 00:32 - what template i used 01:40 - exploring the final migrated app 02:36 - how I migrated from next.js 03:35 - following the migration guide 04:39 - how to incrementally move from next.js to your new Framework 05:18 - the First steps of the migration and getting vite up and running 06:37 - vite config 07:28 - tanstack start dependencies 08:26 - context providers migration 09:07 - migrating custom fonts 10:43 - additional info on context providers and app layout 12:04 - .env variable handling 13:21 - moving away from next.js primitives to other Framework 14:32 - next/image alternative 15:31 - migrating routes and server actions 17:23 - changing the components to not use useRouter from next 18:01 - alterations in react-router 19:21 - incremental migration of routes 19:36 - migrating better-auth and auth in general 20:15 - poly env variable handling 20:49 - better-auth important info 21:40 - migrating over the rest of the project and how I did it 23:06 - removing next from your project completely 24:18 - final migration thoughts 25:20 - outro 🔖 Tags: React Router framework, Vite, React Router Vite, web development, frontend development, Remix tutorial, coding tutorial, Remix Vite tutorial, open source, coding community, remix framework tutorial, react router, react router tutorial