Guide · Open source
How to use TanStack Router: install and set up type-safe routes
Updated · written with AI from the project's own documentation and checked against our catalogue data
TanStack Router is an open-source routing library for web apps, written in TypeScript and released under the MIT licence. It is aimed at React developers who want navigation, URL parameters and search parameters checked by TypeScript. This guide explains what the project covers, what you need before starting, how to get the source, and when to choose it over alternatives.
TanStack RouterTanStack/router · ★ 15.3k · MIT Install options & downloads Quick start
- 1Check prerequisites. Make sure Node.js and npm or another JavaScript package manager are installed on your machine.
- 2Get the source. Clone the repository with git clone https://github.com/TanStack/router as the README describes.
- 3Read the docs. Open tanstack.com/router for the setup and API guides that match your project.
- 4Define typed routes. Set up your routes so paths, params and search params carry TypeScript types.
- 5Validate search params. Attach a schema to search params so values from the URL are checked before use.
- 6Add layouts and error handling. Use nested layouts and error boundaries to structure pages and handle failures.
- 7Consider TanStack Start. If you need server rendering or streaming later, look at TanStack Start, which the README describes as built on Router.
What TanStack Router does
TanStack Router is a routing library for web apps. Its stated goal is to make navigation, URL parameters and search parameters type-safe, so mistakes are caught by TypeScript rather than at runtime.
According to the project's README, the router also includes built-in caching, prefetching and invalidation, nested layouts, transitions and error boundaries, and it supports schema-driven search params with validation.
- End-to-end type safety for routes, params and loaders
- Schema-driven search params with validation
- Built-in caching, prefetching and invalidation
- Nested layouts, transitions and error boundaries
What you need before you start
The README's prerequisites are Node.js and npm or another JavaScript package manager. The project is written in TypeScript and the README centres on TypeScript and JavaScript, so a project in those languages is the expected setup.
The README pitches TanStack Router as part of a larger family of related TanStack packages, so expect to see other TanStack libraries alongside it.
- Node.js
- npm or another JavaScript package manager
- Basic familiarity with TypeScript and React
Get the TanStack Router source
The README's install instruction is to clone the repository. Run the command below to download the source code from GitHub into a local folder.
The README also points to a docs site at tanstack.com/router, which covers usage in more depth. Check that site for the current setup steps for your project.
git clone https://github.com/TanStack/routerUnderstand type-safe routes and search params
The main reason to use the library is that routes, URL parameters and search parameters are typed. If a link or a component reads a parameter with the wrong name or type, TypeScript reports the problem during development.
Search parameters can be validated against a schema, which means values read from the URL are checked before your code uses them. The README describes this as schema-driven search params with validation.
- Route paths and params are typed end to end
- Search params can be validated with a schema
- Errors show up in TypeScript instead of in production
Add nested layouts and error handling
Nested layouts let a parent route wrap its child routes, so shared parts of a page are defined once. Error boundaries let you show a fallback when a route fails.
These features are listed in the README as part of the router. Read the docs for the exact API, since this page does not cover the code syntax.
- Nested layouts for shared page structure
- Error boundaries for route-level failures
- Transitions between routes
Know when TanStack Start fits
TanStack Start is a separate full-stack framework built on Router. According to the README it adds full-document server-side rendering, streaming, server functions and deployment-ready builds.
If you only need client-side routing, you can use Router on its own. If you later want server rendering, the README presents Start as the path that keeps the same router features.
- Router alone: client-side routing with typed routes
- Start: adds server rendering, streaming and server functions
What people use it for
- Building a single-page React app where URL parameters must be typed
- Validating search params such as filters or pagination against a schema
- Splitting a dashboard into nested layouts with shared navigation
- Adding server rendering later through TanStack Start without changing the router
Frequently asked questions
Is TanStack Router free to use?
Yes. The repository is licensed under MIT, which is a permissive open-source licence. Check the LICENSE file in the repository for the full terms.
What do I need to install TanStack Router?
The README lists Node.js and npm or another JavaScript package manager as prerequisites. The documented install step is to clone the repository with git.
Does TanStack Router work with React?
The project describes itself as a router for React and more. The README is centred on TypeScript and JavaScript, and the homepage at tanstack.com/router has the framework-specific guides.
What is the difference between TanStack Router and TanStack Start?
TanStack Router is the routing library. TanStack Start is a separate full-stack framework built on Router that adds server rendering, streaming and server functions, according to the README.
How does TanStack Router compare to React Router or Next.js?
React Router and Next.js are comparable projects in the same space. TanStack Router's distinguishing point, per the README, is type safety for routes, params and search params. Compare the feature sets against your needs before choosing.
Where do I get help if something does not work?
The README points to GitHub discussions, a Discord community and CONTRIBUTING.md for setup instructions. Issues and pull requests are welcome on the repository.
New agent skills, repos and AI tools — every week
The best new skills and open-source projects, the fastest-growing repos, and one free prompt. Five minutes to read. Unsubscribe anytime.
Our verdict
TanStack Router suits React or TypeScript developers who want type-checked routes and validated search params, and who may add server rendering later through TanStack Start. Skip it if you are a non-developer, do not use TypeScript or JavaScript, or want a minimal router without a wider ecosystem of related packages.
Install options & downloads