tanstack-query

Manage React server state with TanStack Query v5 hooks.

Updated Dec 26, 2025
One-click install
npx skills add https://github.com/Yoriichi-Dang/dashboard_web_template --skill tanstack-query-yoriichi-dang
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: tanstack-query
Source: https://github.com/Yoriichi-Dang/dashboard_web_template/tree/main/.agents/skills/tanstack-query
Command: npx skills add https://github.com/Yoriichi-Dang/dashboard_web_template --skill tanstack-query-yoriichi-dang

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes scripts (resource) and references (resource) and assets (resource) components.

What problem does it solve?

This Skill helps developers manage server state in React applications using TanStack Query v5.

Core Features & Use Cases

  • Data fetching, caching, and mutation orchestration with hooks like useQuery, useMutation, and useInfiniteQuery.
  • SSR hydration support and offline/PWA scenarios, including advanced patterns such as infinite queries and parallel queries.
  • Migration guidance for v4→v5, debugging SSR/hydration issues, and guidance on practical use cases across real-world apps.

Quick Start

Install and configure TanStack Query, create a QueryClient, wrap your app with QueryClientProvider, and start using useQuery/useMutation for server data.

Frequently Asked Questions about tanstack-query

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

FAQPage Schema
How do I fetch and cache server state in React using TanStack Query v5?

Fetch and cache server state in React by wrapping your app in QueryClientProvider and using the useQuery hook with object syntax. This approach automatically manages caching, background updates, and garbage collection via gcTime.

What's the best way to migrate from React Query v4 to TanStack Query v5?

Migrate from React Query v4 to v5 by transitioning to object syntax hooks like useQuery and useMutation, utilizing the new queryOptions utility, and replacing staleTime configurations with gcTime according to the provided migration guidance.

Does TanStack Query work with SSR hydration in React 18 applications?

Yes, TanStack Query supports SSR hydration in React 18 applications by prefetching queries on the server and hydrating them on the client. This ensures seamless server-state synchronization without waterfall data fetching issues.

How do I handle data mutations and infinite scrolling with TanStack Query?

Handle data mutations using the useMutation hook to orchestrate server updates, and implement infinite scrolling by configuring useInfiniteQuery to manage paginated server state with automatic caching and refetching behaviors.

Can I use TanStack Query for offline and PWA data synchronization?

Yes, TanStack Query can manage offline and PWA scenarios by utilizing its built-in caching and mutation orchestration to persist data locally, allowing applications to synchronize server state when connectivity is restored.

Do I need TypeScript to use TanStack Query v5?

TanStack Query v5 requires React 18+ and TypeScript 4.7+ to ensure proper type safety with object syntax hooks like useQuery and utilities like queryOptions, though the underlying library remains compatible with standard JavaScript.