Awesome
<img src="https://static.scarf.sh/a.png?x-pxid=d988eb79-b0fc-4a2b-8514-6a1ab932d188" />
🤖 Type-safe router w/ built-in caching & URL state management for React!
<a href="https://twitter.com/intent/tweet?button_hashtag=TanStack" target="\_parent"> <img alt="#TanStack" src="https://img.shields.io/twitter/url?color=%2308a0e9&label=%23TanStack&style=social&url=https%3A%2F%2Ftwitter.com%2Fintent%2Ftweet%3Fbutton_hashtag%3DTanStack"> </a><a href="https://discord.com/invite/WrRKjPJ" target="\_parent"> <img alt="" src="https://img.shields.io/badge/Discord-TanStack-%235865F2" /> </a><a href="https://npmjs.com/package/@tanstack/react-router" target="\_parent"> <img alt="" src="https://img.shields.io/npm/dm/@tanstack/router.svg" /> </a><a href="https://bundlephobia.com/result?p=@tanstack/react-router" target="\_parent"> <img alt="" src="https://badgen.net/bundlephobia/minzip/@tanstack/react-router" /> </a><a href="#badge"> <img alt="semantic-release" src="https://img.shields.io/badge/%20%20%F0%9F%93%A6%F0%9F%9A%80-semantic--release-e10079.svg"> </a><a href="https://github.com/tanstack/router/discussions"> <img alt="Join the discussion on Github" src="https://img.shields.io/badge/Github%20Discussions%20%26%20Support-Chat%20now!-blue" /> </a><a href="https://bestofjs.org/projects/router"><img alt="Best of JS" src="https://img.shields.io/endpoint?url=https://bestofjs-serverless.now.sh/api/project-badge?fullName=tanstack%2Frouter%26since=daily" /></a><a href="https://github.com/tanstack/router" target="\_parent"> <img alt="" src="https://img.shields.io/github/stars/tanstack/router.svg?style=social&label=Star" /> </a><a href="https://twitter.com/tan_stack" target="\_parent"> <img alt="" src="https://img.shields.io/twitter/follow/tan_stack.svg?style=social&label=Follow @TanStack" /> </a><a href="https://twitter.com/tannerlinsley" target="\_parent"> <img alt="" src="https://img.shields.io/twitter/follow/tannerlinsley.svg?style=social&label=Follow @TannerLinsley" /> </a>Enjoy this library? Try the entire TanStack! React Query, React Table, React Charts, React Virtual
Visit tanstack.com/router for docs, guides, API and more!
Partners
<div><a href="https://vercel.com?utm_source=tanstack"> <img alt="Vercel" src="https://raw.githubusercontent.com/tannerlinsley/files/master/partners/vercel.svg" height="40" </a></div><br /> <div><a href="https://go.clerk.com/wOwHtuJ"> <img alt="Clerk" src="https://raw.githubusercontent.com/tannerlinsley/files/master/partners/clerk.svg" height="40" </a></div><br /> <div><a href="https://ag-grid.com/react-data-grid/?utm_source=reacttable&utm_campaign=githubreacttable"> <img alt="AG Grid" src="https://raw.githubusercontent.com/tannerlinsley/files/master/partners/ag-grid.svg" height="40" </a></div><br /> <div><a href="https://convex.dev?utm_source=tanstack"> <img alt="Convex" src="https://raw.githubusercontent.com/tannerlinsley/files/master/partners/convex.svg" height="40" </a></div><br /> <div><a href="https://sentry.io?utm_source=tanstack"> <img alt="Sentry" src="https://raw.githubusercontent.com/tannerlinsley/files/master/partners/sentry.svg" height="40" </a></div><br /> <div><a href="https://nozzle.io/?utm_source=tanstack&utm_campaign=tanstack"> <img alt="Nozzle.io" src="https://raw.githubusercontent.com/tannerlinsley/files/master/partners/nozzle.svg" height="40" </a></div><br />Quick Features
- 100% TypeSafe
- Route Defs
- Navigation
- Relative Navigation
- Search Params
- Path Params
- Loaders
- 1st Class Search Params
- Schemas + Validation
- Parsing + Serialization
- Immutable
- Structural Sharing
- Pre/Post Processing
- Built-in Caching
- Stale-While-Revalidate
- Max-Age
- Auto Garbage Collection
- Invalidation
- Prefetching
- Automatic Prefetching
- Transitions
- Error Boundaries
- Code Splitting
- Layout Routes
- Easy Integration w/ external caches and storage (eg. React Query, Apollo, SWR, RTKQuery)
Example Usage
To run example React projects with Tanstack Router, see CONTRIBUTING.md
<!-- Use the force, Luke!! -->