Back to articles
React Router v7 Has a Free Full-Stack Framework Hidden Inside

React Router v7 Has a Free Full-Stack Framework Hidden Inside

via Dev.to ReactAlex Spinov

React Router v7 is not just a routing library anymore. It is a full-stack React framework — the spiritual successor to Remix, merged directly into React Router. The Big Change Remix and React Router merged. React Router v7 now includes: File-based routing Server-side rendering Data loading (loaders) Data mutations (actions) Streaming Progressive enhancement Framework Mode npx create-react-router@latest my-app cd my-app && npm run dev File-Based Routes app/ routes/ _index.tsx → / about.tsx → /about users.tsx → /users (layout) users.$id.tsx → /users/:id blog._index.tsx → /blog blog.$slug.tsx → /blog/:slug Loaders (Server-Side Data) // app/routes/users.$id.tsx import type { Route } from " ./+types/users.$id " ; export async function loader ({ params }: Route . LoaderArgs ) { const user = await db . user . findUnique ({ where : { id : params . id } }); if ( ! user ) throw new Response ( " Not Found " , { status : 404 }); return { user }; } export default function UserProfile ({ loaderData

Continue reading on Dev.to React

Opens in a new tab

Read Full Article
2 views

Related Articles