What is nested routing in Remix?
Answer
Nested routing is Remix's core architectural feature. Routes are organized in a file hierarchy that mirrors the URL structure, and parent routes wrap child routes. File structure: routes/dashboard.tsx renders a layout with <Outlet />; routes/dashboard.users.tsx renders inside that layout at /dashboard/users. Each route in the hierarchy can have its own: loader (data), action (mutations), ErrorBoundary (error UI). All loaders run in parallel — the parent layout and child content fetch data simultaneously. Layout route: export default function Dashboard() { return <div><Sidebar /><Outlet /></div>; }. The Outlet renders the matched child route. Benefits: Shared layouts without prop drilling. Parallel data loading. Granular error boundaries — an error in the child doesn't break the parent layout. Prefetching: Remix can prefetch loaders for links the user might click.