react-router

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

Updated Apr 2, 2026

Search Tags:#react #routing #hooks #navigation #type-safety #bindings #tanstack-router

Ready to run

npx skills add https://github.com/abereghici/skills --skill react-router-abereghici

💬 Prompt for ChatGPT / Claude Chat▼

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.