skills.rest
TanStack
TanStackOFFICIAL
Explore all skills by this author →
Website𝕏@tan_stackGitHub

router-core/path-params

Parse dynamic, splat, and optional path params in TanStack Router routes.

14.9k|1.8k|Updated Jan 14, 2019
Search Tags:#typescript#routing#i18n#tanstack-router#path-params#dynamic-paths
One-click install
npx skills add https://github.com/TanStack/router --skill router-core-path-params
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: router-core/path-params
Source: https://github.com/TanStack/router/tree/main/packages/router-core/skills/router-core/path-params
Command: npx skills add https://github.com/TanStack/router --skill router-core-path-params

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve? Dynamic path segments simplify routing by capturing URL portions as named parameters, reducing manual parsing and boilerplate. This skill standardizes how to declare, document, and reuse path parameter patterns across routes.

Core Features & Use Cases - Supports dynamic segments ($param), splat routes ($), optional params ({-$param}), and prefix/suffix patterns ({$param}.ext) - Includes i18n locale patterns, useParams, and params.parse/stringify to ensure type-safe access and transformation - Enables end-to-end routing scenarios with robust validation and deterministic behavior

Quick Start Use dynamic path params to capture and utilize route segments across nested routes.

Frequently Asked Questions about router-core/path-params

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

FAQPage Schema
How do I capture dynamic path params with TanStack Router?▼

Capture dynamic path params in TanStack Router by declaring dynamic segments like $param to parse URL portions into named parameters, reducing manual parsing and boilerplate. This standardizes parameter pattern reuse across nested routes.

Does TanStack Router support optional params and splat routes?▼

TanStack Router supports optional params using the {-$param} syntax and splat routes using the $ character. It also handles prefix and suffix patterns like {$param}.ext for versatile URL matching scenarios.

How do I parse and stringify i18n locale patterns in TypeScript routing?▼

Parse and stringify i18n locale patterns in TypeScript routing using params.parse and params.stringify utilities. This ensures type-safe access and transformation of locale data within dynamic route segments.

What is the best way to ensure type-safe navigation with dynamic path segments?▼

Ensure type-safe navigation with dynamic path segments by applying defined param parsing utilities and frontmatter metadata to satisfy the runtime contract via router-core, enabling deterministic validation and robust end-to-end routing behavior.

Can I use useParams to access dynamic, splat, and optional params in TanStack Router?▼

Use the useParams hook to access dynamic, splat, and optional params in TanStack Router. It provides type-safe access to captured URL segments, including prefix and suffix variations, for loader data and navigation.

Related Skills

Explore More Software Engineering Skills→
MadAppGangMadAppGang
278

tanstack-router

Configure type-safe file-based routes for React with TanStack Router.

Official
Intermediate
cill-i-amcill-i-am

router-core/path-params

Clarify dynamic path params in TanStack Router routes.

Community
Intermediate
JeromyJSmithJeromyJSmith
3

tanstack-router

Configure type-safe TanStack Router routes with validated params and loaders.

Community
Advanced
wsimmondswsimmonds
109

nextjs-dynamic-routes-params

Maps URL segments to dynamic route files and accesses params in Next.js App Router.

Community
Basic