remix

remix

Built on Web Fetch API (Request/Response, Headers). No abstractions over platform primitives.

Core Concepts

• Nested routes: file-based layouts with <Outlet>, each route is its own layout layer
• Loaders: server data loading, runs before render, returns via useLoaderData
• Actions: server mutations triggered by <Form> POST, returns via useActionData
• Progressive enhancement: <Form> works without JS, enhances with JS enabled

Routing & Data

• loader/action functions export from route files, run only on server
• useFetcher loads data imperatively from any component without navigation
• Resource routes: return non-HTML responses like API JSON or file downloads
• ErrorBoundary per route catches render errors without breaking the app

Best Practices

• Use <Form> over raw <form> for pending UI and progressive enhancement
• Load data in loaders, not in useEffect or client-side fetchers
• Serialize session state in loaders, read cookies from request headers
• Resource routes for endpoints consumed by external clients

Common Code Patterns

• Form action with redirect on success, return validation errors on failure
• Loader reads session cookie, fetches user data, returns combined response