react-router

Provide type-safe React bindings for TanStack Router routes and navigation.

Updated Apr 2, 2026
One-click install
npx skills add https://github.com/abereghici/skills --skill react-router-abereghici
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: react-router
Source: https://github.com/abereghici/skills/tree/main/skills/tanstack-react-router
Command: npx skills add https://github.com/abereghici/skills --skill react-router-abereghici

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

React bindings for TanStack Router provide a cohesive, type-safe interface for integrating RouterProvider, route creators, and navigation hooks in React apps.

Core Features & Use Cases

  • Type-safe bindings for TanStack Router in React, including RouterProvider, createRootRoute, and createFileRoute.
  • Hooks and components for common routing patterns: useRouter, useParams, useLoaderData, Link, Navigate, Outlet, and dynamic route composition.
  • Ideal for building scalable React apps with file-based routing, strong typing, and seamless integration with router-core.

Quick Start

Install the TanStack React Router bindings in your project and begin wiring RouterProvider and routes in your application.

Frequently Asked Questions about react-router

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I set up type-safe routing in a React app using TanStack Router?

Type-safe routing in a React app using TanStack Router is set up by wiring the RouterProvider and configuring root routes with createRootRoute. This provides a cohesive, strongly typed interface for route creators and navigation hooks.

What hooks are available for navigation and data loading in TanStack Router?

TanStack Router provides hooks like useRouter, useParams, and useLoaderData for navigation and data loading. These hooks enforce strong typing and client-first routing semantics within your React application.

Does TanStack Router support file-based routing for React applications?

Yes, TanStack Router supports file-based routing for React applications through the createFileRoute binding. This allows you to build scalable apps with strong typing and seamless integration with router-core.

Can I use React components like Link and Outlet with TanStack Router bindings?

Yes, you can use React components like Link, Navigate, and Outlet with TanStack Router bindings. They enable common routing patterns and dynamic route composition while maintaining strict type safety.

Why should I choose type-safe React bindings for TanStack Router over standard routing?

Type-safe React bindings for TanStack Router enforce strong typing across route creation and navigation, preventing runtime errors. They offer a cohesive interface for RouterProvider and hooks, simplifying scalable app development.

Are there limitations when integrating TanStack Router router-core with React?

Integration focuses on client-first routing semantics and requires applying specific bindings like createRootRoute and createFileRoute. Limitations arise if you deviate from these strongly typed usage patterns and router-core integration rules.