skills.rest
lespaceman
lespacemanCOMMUNITY
Explore all skills by this author →
WebsiteGitHub

router-core

Create framework-agnostic route trees and routers with type-safe TanStack Router core.

4|1|Updated Feb 3, 2026
Search Tags:#typescript#routing#tanstack#router#types#ssr#inference
One-click install
npx skills add https://github.com/lespaceman/athena-workflow-marketplace --skill router-core-lespaceman
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: router-core
Source: https://github.com/lespaceman/athena-workflow-marketplace/tree/main/plugins/tanstack-start/skills/upstream/%40tanstack/router-core/skills/router-core
Command: npx skills add https://github.com/lespaceman/athena-workflow-marketplace --skill router-core-lespaceman

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Provides a framework-agnostic, type-safe foundation for TanStack Router that unifies core routing concepts across React and Solid, enabling predictable, scalable routing.

Core Features & Use Cases

  • Core concepts: route trees, createRouter, createRoute, createRootRoute, createRootRouteWithContext, addChildren, Register type declaration, route matching, route sorting, and file naming conventions.
  • Framework-agnostic core supports client and server scenarios and powers all Skill units.
  • Use cases include building reliable routing layers for multi-project apps and serving as the foundation for sub-skills like data-loading, navigation, code-splitting, and SSR hydration.

Quick Start

Initialize a router core by calling createRouter with your routeTree and mounting it with RouterProvider in your app.

Frequently Asked Questions about router-core

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

FAQPage Schema
How do I set up a type-safe route tree with TanStack Router?▼

Initialize a type-safe route tree by calling createRouter with your routeTree and mounting it via RouterProvider, using createRoute and createRootRoute to establish context-driven data flow across client and server rendering.

What is the framework-agnostic core in TanStack Router used for?▼

The framework-agnostic core unifies routing concepts across React and Solid, providing a type-safe foundation for route trees, route matching, and context-driven data flow that enables predictable and scalable routing layers.

Can I use TanStack Router core for SSR hydration and data loading?▼

Yes, the core supports client and server rendering scenarios, serving as the foundation for sub-skills including SSR hydration, data-loading, navigation, and code-splitting capabilities.

How does context-driven data flow work in TanStack Router?▼

Context-driven data flow operates through createRootRouteWithContext, allowing you to pass typed context across route trees during route matching and sorting for both client and server rendering scenarios.

What's the best way to structure route trees for multi-project applications?▼

Structure route trees using createRoute, addChildren, and file naming conventions to build reliable routing layers across multiple projects, ensuring end-to-end type inference and framework-agnostic compatibility.

Does TanStack Router core support end-to-end type inference without framework bindings?▼

Yes, the core provides end-to-end type inference through the Register type declaration and route tree APIs, maintaining framework-agnostic design compatible with TanStack Router v1.166.2.

Related Skills

Explore More Software Engineering Skills→
hashintelhashintel
7

router-core

Build type-safe routing infrastructure for React and Solid applications.

Official
Intermediate
jcsoftdevjcsoftdev

progressive-hydration

Implements progressive hydration for SSR React apps using Suspense and code-splitting.

Community
Advanced
inpinitiinpiniti

solid

Transform json-render specs into reactive Solid component trees.

Community
Advanced
evolv3aievolv3ai
3

TanStack Router

Build type-safe, file-based React routing with TanStack Router.

Community
Intermediate