What problem does it solve?
TanStack Router eliminates fragile, untyped routing code and ad-hoc navigation logic by providing a single, type-safe routing system that unifies path params, search params, data loading, and navigation behaviors for React and Solid applications. It reduces runtime errors, prevents mismatched route parameter usage, and centralizes routing concerns so teams can reason about navigation, preloading, and access control with confidence.
Core Features & Use Cases
- File-based and code-based route trees with first-class TypeScript integration for fully typed params, search, and loader data.
- Built-in data loaders, loaderDeps, deferred loading, and preloading strategies to coordinate data fetching, caching, and UX for fast navigations.
- Advanced search param validation, serialization options, and typed hooks (useParams, useSearch, useLoaderData, useNavigate) for safe programmatic navigation.
- Auth and guard patterns via beforeLoad, route-level error/pending/notFound handlers, scroll restoration, and route masking for complex apps.
- Use Case: Build a dashboard with paginated lists, authenticated sections, and optimistic preloading where routes provide typed loader data to components and integrate with a QueryClient.
Quick Start
Create a file-based /posts route that validates search params, loads paginated posts via a typed loader, and exposes type-safe hooks for params and search.