TanStack Skills
Claude Code skills for the complete TanStack ecosystem. Comprehensive API documentation, code examples, TypeScript patterns, best practices, and common pitfalls for AI-assisted development.
Quick Install (Plugin Marketplace)
# Add the marketplace
/plugin marketplace add tanstack-skills/tanstack-skills
# Install all TanStack skills
/plugin install tanstack-all@tanstack-skills
# Or install individual plugins
/plugin install tanstack-query@tanstack-skills
/plugin install tanstack-router@tanstack-skills
/plugin install tanstack-start@tanstack-skills
Available Plugins
Bundle Plugins
| Plugin | Description |
|---|
tanstack-all | All 13 TanStack skills - complete ecosystem coverage |
tanstack-core | Start + Router + Query - the essential full-stack trio |
tanstack-ui | Table + Form + Virtual - headless UI components |
tanstack-data | Query + Store + DB - state management and data layer |
Individual Plugins
| Plugin | Status | Description |
|---|
tanstack-start | RC | Full-stack React framework with SSR, streaming, server functions |
tanstack-router | Stable | Type-safe file-based routing with search params and data loading |
tanstack-query | Stable | Async state management with caching, mutations, and SSR |
tanstack-table | Stable | Headless tables with sorting, filtering, pagination, virtualization |
tanstack-form | Stable | Headless forms with sync/async/schema validation |
tanstack-db | Beta | Client-first reactive database with live queries |
tanstack-ai | Alpha | Provider-agnostic AI SDK with streaming and tool calling |
tanstack-virtual | Stable | Virtualization for lists and grids with dynamic sizing |
tanstack-pacer | Beta | Debouncing, throttling, rate limiting, queuing |
tanstack-store | Alpha | Framework-agnostic reactive data store |
tanstack-devtools | Alpha | Centralized devtools panel with plugin architecture |
tanstack-config | Stable | Build, lint, and publish configuration toolkit |
tanstack-cli | Stable | Project scaffolding with 30+ integrations and MCP server |
Installation Methods
Method 1: Plugin Marketplace (Recommended)
# Step 1: Add this repository as a marketplace
/plugin marketplace add tanstack-skills/tanstack-skills
# Step 2: Install plugins you need
/plugin install tanstack-all@tanstack-skills # Everything
/plugin install tanstack-core@tanstack-skills # Start + Router + Query
/plugin install tanstack-query@tanstack-skills # Just Query
Method 2: Direct Git URL
/plugin marketplace add https://github.com/tanstack-skills/tanstack-skills.git
/plugin install tanstack-all@tanstack-skills
Method 3: Local Clone
git clone https://github.com/tanstack-skills/tanstack-skills.git
/plugin marketplace add ./tanstack-skills
/plugin install tanstack-all@tanstack-skills
Managing Plugins
# List installed plugins
/plugin list
# Update marketplace
/plugin marketplace update
# Disable a plugin
claude plugin disable tanstack-query@tanstack-skills
# Uninstall a plugin
claude plugin uninstall tanstack-query@tanstack-skills
What's Included
Each skill provides:
- Overview - Package names, installation, and core concepts
- API Reference - Hooks, functions, classes, and their signatures
- Code Examples - Real-world usage patterns with TypeScript
- TypeScript Patterns - Type inference, generics, and type safety tips
- Best Practices - Recommended patterns and architectural guidance
- Common Pitfalls - Mistakes to avoid and how to fix them
- Integration Patterns - How libraries work together
TanStack Ecosystem
┌─────────────────────────────────────────────────────────────┐
│ TanStack Start │
│ (Full-stack React Framework) │
├─────────────────────────────────────────────────────────────┤
│ Router │ Query │ Form │ Table │ Virtual │ AI │
├──────────┴─────────┴────────┴─────────┴───────────┴────────┤
│ DB │ Store │ Pacer │ Devtools │
├─────────────────────────────────────────────────────────────┤
│ Config │ CLI (scaffolding + MCP) │
└─────────────────────────────────────────────────────────────┘
Repository Structure
tanstack-skills