tanstack-query

Manage React server-state with TanStack Query v5 patterns and migration guidance.

204|30|Updated Nov 8, 2025
One-click install
npx skills add https://github.com/secondsky/claude-skills --skill tanstack-query-secondsky
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: tanstack-query
Source: https://github.com/secondsky/claude-skills/tree/main/plugins/tanstack-query/skills/tanstack-query
Command: npx skills add https://github.com/secondsky/claude-skills --skill tanstack-query-secondsky

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

A collection of TanStack Query v5 patterns, migration guidance, and practical examples for React data fetching.

Core Features & Use Cases

  • Migration guidance: v4 → v5 patterns, with concrete fixes.
  • Patterns & Examples: Parallel queries, pagination, optimistic updates, and prefetching.
  • Testing & DX: Testing strategies and DX best practices for queries.

Quick Start

Integrate TanStack Query v5 into a React app and adopt the object syntax with queryKey and queryFn.

Frequently Asked Questions about tanstack-query

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

FAQPage Schema
How do I migrate from React Query v4 to TanStack Query v5?

TanStack Query v5 migration involves adopting object syntax with queryKey and queryFn parameters, updating cache invalidation patterns, and adjusting mutation workflows. This Skill provides concrete v4 to v5 fixes and migration guidance for smooth upgrades.

What's the best way to handle pagination with TanStack Query?

Pagination with TanStack Query uses hierarchical cache keys and query invalidation to manage paginated datasets efficiently. This Skill covers pagination patterns that maintain proper cache state across page transitions.

How do I implement optimistic updates in React data fetching?

Optimistic updates in TanStack Query mutations let you update the UI before server confirmation, improving perceived performance. This Skill shows mutation workflows with invalidation and optimistic update patterns for better UX.

Can I use TanStack Query with server-side rendering in React?

Yes, TanStack Query v5 supports both client-side and server-side rendering environments. This Skill covers SSR and CSR patterns, enabling data fetching that works across different rendering contexts.

What testing strategies work best for TanStack Query applications?

Testing TanStack Query requires mocking queryFn, managing cache state, and validating mutation behavior. This Skill includes testing strategies and DX best practices for reliable query and mutation tests.

Does TanStack Query support TypeScript and DevTools integration?

TanStack Query v5 provides TypeScript-friendly typings and DevTools support for debugging queries and mutations. This Skill demonstrates type-safe patterns and leverages DevTools for development visibility.