TanStack Router

566

Contributors on GitHub

24,445

Dependents on GitHub

import { createRootRoute, createRoute, createRouter, RouterProvider } from '@tanstack/react-router'

const rootRoute = createRootRoute()
const indexRoute = createRoute({
  getParentRoute: () => rootRoute,
  path: '/',
  component: () => <div>Hello World</div>,
})
const routeTree = rootRoute.addChildren([indexRoute])
const router = createRouter({ routeTree })

export default function App() {
  return <RouterProvider router={router} />
}

import { createRootRoute, createRoute, createRouter, RouterProvider } from '@tanstack/react-router'

const rootRoute = createRootRoute()
const indexRoute = createRoute({
  getParentRoute: () => rootRoute,
  path: '/',
  component: () => <div>Hello World</div>,
})
const routeTree = rootRoute.addChildren([indexRoute])
const router = createRouter({ routeTree })

export default function App() {
  return <RouterProvider router={router} />
}

Typesafe & powerful, yet familiarly simple

TanStack Router builds on modern routing patterns made popular by other tools, but has been re-engineered from the ground up to be 100% typesafe without compromising on DX. You can have your cake and eat it too!

Built-in Data Fetching with Caching

Hoist your data fetching and avoid waterfalls with TanStack Router's loader API and get instant navigations with built-in caching and automatic preloading. Need something more custom? Router's API is designed to work with your favorite client-side cache libraries!

Search Param APIs to make your state-manager jealous

Instead of throwing you to the URLSearchParam wolves, TanStack Router outfits you with state-manager-grade search param APIs. With schemas, validation, full type-safety and pre/post manipulation, you can manage your state in the URL and easily sync it to your state-manager of choice.

An ad on an open source project? What is this, 1999?

Please... TanStack is 100% privately owned, with no paid products, venture capital, or acquisition plans. We're a small team dedicated to creating software used by millions daily. What did you expect?

Check out our ethos to learn more about how we plan on sticking around (and staying relevant) for the long-haul.

TanStackRouter

Type-safe Routing for React and Solid applications

Typesafe & powerful, yet familiarly simple

Built-in Data Fetching with Caching

Search Param APIs to make your state-manager jealous

Partners

Feature Rich and Lightweight

Sponsors

Take it for a spin!