TanStack Agent Skills
Four skills with prioritized rules for TanStack Query, Router and Start: caching, routing and server functions.
- 230 ★ on the repository
- Last commit
- MIT
Minimal access
Why this level
- The skills are Markdown rules: they run nothing and contact nothing, they only shape how the agent writes TanStack code.
Install
- Works in
In your terminal, with SkillFoxx CLI
npx skillfoxx add skills/tanstack-agent-skillsDetects the agents on your machine, shows the access level and pins the version.
Other ways to install
Access and checks
How we reviewMinimal accessThe tool runs nothing and makes no network calls.
- The skills are Markdown rules: they run nothing and contact nothing, they only shape how the agent writes TanStack code.
This is third-party code. Review the repository files before installing.
What it does
TanStack Agent Skills is four skills with practical rules for TanStack projects. `tanstack-query` covers query keys, caching (`staleTime`, `gcTime`, invalidation), mutations with optimistic updates, retries on errors, prefetching, infinite lists and hydration under server rendering. `tanstack-router` describes type-safe routing: file-based routes, data loaders, search params, code splitting and preloading. `tanstack-start` gathers rules for full applications: `createServerFn` server functions, middleware, authentication, CSRF protection and streaming SSR. The fourth skill, `tanstack-integration`, ties Query to Router and Start: a shared `QueryClient` in router context, loaders that fill the cache, and consistent dehydration. Each rule is a separate file in `rules/` with a priority from CRITICAL to LOW, an explanation, a bad and a good example, and a condition for when it applies.
Who it is for. React developers on TanStack Query, Router or Start who ask an agent to write and review that code against vetted rules.
Good fit when
- An agent writes the first `useQuery` in a project and needs sensible keys and cache lifetimes.
- A mutation should update the interface at once and roll back when the server fails.
- The project's routes keep growing while search params and loaders stay untyped.
- Code is reviewed for duplicate requests and hydration mismatches under server rendering.
- TanStack Start server functions are guarded with input validation and a session.
Not a fit when
- The project uses another data library such as SWR or Redux Toolkit Query: the rules are written for the TanStack API.
- You are looking for a project generator or CLI: the skills give rules and do not scaffold anything.
- The app is built on Vue, Solid or Svelte: the rules describe React hooks and components.
- The library itself is still being chosen: the skills assume TanStack is already adopted.
Example request
Review data fetching in this project against the TanStack Query rules and fix the query keys and staleTime.Limitations
The skills advise but verify nothing: there is no linter or run command, and the agent applies the rules from their descriptions. Query, Router, Start and their combination are covered, while Form, Table and other TanStack packages are absent from the repository. The priorities from CRITICAL to LOW were set by the author and do not replace the library documentation, especially after major releases. Installing through `npx skills add` places files in the directories of detected agents, and Cursor can take a manual layout under `.cursor/`. The last commit is dated September 2026.
How to disable. Delete four folders from the agent's skills directory: `tanstack-query`, `tanstack-router`, `tanstack-start` and `tanstack-integration`.
FAQ
How do I install TanStack Agent Skills in Claude Code?
Run `npx skills add DeckardGer/tanstack-agent-skills`. The skills load automatically and fire when the agent sees a task about TanStack queries, routes or server functions.
Which TanStack packages are covered?
Query, Router and Start, plus their joint use in the `tanstack-integration` skill. Form, Table and the other packages are not described in the repository.
What is inside a rule file?
A priority (CRITICAL, HIGH, MEDIUM or LOW), an explanation, a bad example, a good example and context: when to apply the rule and when to skip it.
What matters most in TanStack Query?
The rules on query key structure and on caching are marked critical: `staleTime`, `gcTime` and invalidation. Mutations and error handling come next, then prefetching, infinite lists and server rendering.
Do the skills work in Cursor?
Yes. They suit any agent that reads `AGENTS.md`, and in Cursor they can be placed manually under `.cursor/`.
Discussion
No questions or reviews yet.
Related
SkillsThe official CLI for creating TanStack Start and Router apps, with machine-readable JSON output for coding agents
Hand-built skills for Angular, React, Next.js, TypeScript and Django plus six community ones for Java, Elixir and Electron
An agent plugin for Rstack: configure, upgrade to v2, debug and analyse Rspack, Rsbuild, Rslib, Rspress and Rstest builds.
The official React Router skill: the agent identifies the app mode and follows the docs for the installed version
Four official Material UI skills: styling, theming, Next.js integration and working alongside Tailwind CSS
julianromli/ai-skills
ai-skills
A collection of 31 skills for Claude Code and other agents: interfaces, React, Postgres, code review, SEO and browser automation
README in short
The repository follows the Agent Skills standard, with `AGENTS.md` and `CLAUDE.md` in the root. Additions to the rules are welcome provided the examples run and the priorities are justified. The license is MIT.
README badge
Original SKILL.md
--- name: tanstack-query-best-practices description: TanStack Query (React Query) best practices for data fetching, caching, mutations, and server state management. Activate when building data-driven React applications with server state. --- # TanStack Query Best Practices Comprehensive guidelines for implementing TanStack Query (React Query) patterns in React applications. These rules optimize data fetching, caching, mutations, and server state synchronization. ## When to Apply - Creating new data fetching logic - Setting up query configurations - Implementing mutations and optimistic updates - Configuring caching strategies - Integrating with SSR/SSG - Refactoring existing data fetching code ## Rule Categories by Priority | Priority | Category | Rules | Impact | |----------|----------|-------|--------| | CRITICAL | Query Keys | 5 rules | Prevents cache bugs and data inconsistencies | | CRITICAL | Caching | 5 rules | Optimizes performance and data freshness | | HIGH | Mutations | 6 rules | Ensures data integrity and UI consistency | | HIGH | Error Handling | 3 rules | Prevents poor user experiences | | MEDIUM | Prefetching | 4 rules | Improves perceived performance | | MEDIUM | Parallel Queries | 2 rules | Enables dynamic parallel fetching | | MEDIUM | Infinite Queries | 3 rules | Prevents pagination bugs | | MEDIUM | SSR Integration | 4 rules | Enables proper hydration | | LOW | Performance | 4 rules | Reduces unnecessary re-renders | | LOW | Offline Support | 2 rules | Enables offline-first patterns | ## Quick Reference ### Query Keys (Prefix: `qk-`) - `qk-array-structure` — Always use arrays for query keys - `qk-include-dependencies` — Include all variables the query depends on - `qk-hierarchical-organization` — Organize keys hierarchically (entity → id → filters)