TanStack Router Best Practices

Use this skill for TanStack Router authoring, review, architecture decisions, debugging, and migrations. Start by deciding whether the problem is route structure, URL state, loader orchestration, or data ownership, then keep the route tree typed, the navigation APIs explicit, and the data-loading story consistent.

Use This Skill When

• Building or reviewing route trees, layouts, pathless layouts, or route-file organization
• Choosing between file-based, code-based, and virtual file routing
• Designing typed links, relative navigation, reusable link options, or route masking flows
• Validating and consuming search params, shared URL state, and search-driven loaders
• Wiring beforeLoad, loaders, auth guards, redirects, not-found handling, and pending states
• Integrating TanStack Router with TanStack Query or TanStack Start
• Fixing stale Router examples that still rely on deprecated route classes, NotFoundRoute, or non-reactive router.state

Out Of Scope

• Generic React component design that is unrelated to routing concerns
• Server-state cache policy design beyond the Router integration point
• Framework setup details outside React unless the user explicitly asks for Solid, Vue, or another supported framework