tanstack-query

Fetch server data in React apps with TanStack Query caching.

5|1|Updated Nov 28, 2025
One-click install
npx skills add https://github.com/ashchupliak/dream-team --skill tanstack-query-ashchupliak
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: tanstack-query
Source: https://github.com/ashchupliak/dream-team/tree/main/skills/tanstack-query
Command: npx skills add https://github.com/ashchupliak/dream-team --skill tanstack-query-ashchupliak

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

TanStack Query patterns simplify server-state management in React apps by providing a robust, declarative approach to data fetching, caching, and synchronization.

Core Features & Use Cases

  • Data fetching with built-in caching and stale-while-revalidate strategies.
  • Mutations and optimistic updates to reflect changes instantly in the UI.
  • Infinite queries and prefetching for responsive, scalable UIs.

Quick Start

Install the provider, wrap your app, and fetch data with a sample useQuery call.

Frequently Asked Questions about tanstack-query

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

FAQPage Schema
How do I manage server state in React with built-in caching?

TanStack Query manages server state in React by providing declarative data fetching with built-in caching and stale-while-revalidate strategies to reduce network calls. It handles synchronization automatically.

What is the best way to handle optimistic updates for mutations in React?

Optimistic updates for mutations in React allow the UI to instantly reflect changes before the server responds. TanStack Query supports this pattern natively, automatically rolling back updates if the mutation fails.

Does TanStack Query work with TypeScript and URL-based cache keys?

TanStack Query ensures full compatibility with TypeScript and supports URL-based cache keys. This allows typed query definitions and precise cache invalidation based on unique URL structures.

How do I implement infinite queries and prefetching for scalable React UIs?

Infinite queries and prefetching in React are implemented using TanStack Query to create responsive, scalable UIs. Prefetching loads data proactively, while infinite queries handle paginated server state efficiently.

When should I use React Query instead of manual data fetching?

Use TanStack Query instead of manual data fetching when your React app needs consistent caching, mutations, or pagination. It replaces manual useEffect logic with a declarative approach for server-state synchronization.