skills.rest
sncollective
sncollectiveOFFICIAL
Explore all skills by this author →
GitHub

tanstack-query-v5

Provide TanStack Query v5 hook references with syntax examples and options.

Updated Mar 4, 2026
Search Tags:#typescript#tanstack#hooks#cache#react-query#data-fetching#v5
One-click install
npx skills add https://github.com/sncollective/snc-platform --skill tanstack-query-v5-sncollective
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: tanstack-query-v5
Source: https://github.com/sncollective/snc-platform/tree/main/.claude/skills/tanstack-query-v5
Command: npx skills add https://github.com/sncollective/snc-platform --skill tanstack-query-v5-sncollective

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Developers often need fast, concise reference material for TanStack Query v5 when building data-fetching logic in React, reducing time spent searching external documentation.

Core Features & Use Cases

  • Import snippets for core hooks and utilities like useQuery, useMutation, useInfiniteQuery, and QueryClient.
  • API quick reference detailing options, return values, and common patterns for each hook.
  • Gotchas and version caveats to avoid common pitfalls such as query key handling and stale vs. gc time.
  • Practical patterns including queryOptions helpers, optimistic updates, conditional queries, and background refetching.
  • Anti‑patterns highlighting mistakes in query key design, cache mutation, and refetch strategies.
  • Use cases ranging from simple data fetching, pagination, infinite scroll, to complex optimistic UI updates.

Quick Start

Ask for a TanStack Query v5 useQuery example that fetches a list of todos.

Frequently Asked Questions about tanstack-query-v5

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

FAQPage Schema
How do I fetch data using TanStack Query v5 useQuery hook in React?▼

To fetch data with the useQuery hook in TanStack Query v5, you provide a query key array and a query function. This reference covers useQuery options, return values, and common data-fetching patterns.

What are the common gotchas with TanStack Query v5 cache handling and query keys?▼

Common TanStack Query v5 cache gotchas include proper query key design and the distinction between staleTime and gcTime. This reference details version caveats and anti-patterns to prevent unexpected cache mutations.

How do I implement optimistic updates with useMutation in React Query v5?▼

Implement optimistic updates in React Query v5 using the useMutation hook with onMutate and onError callbacks to update cache before server confirmation. This reference outlines practical patterns for complex UI updates.

Can I use TanStack Query v5 for infinite scroll and pagination in TypeScript?▼

Yes, TanStack Query v5 supports infinite scroll and pagination in TypeScript via the useInfiniteQuery hook. This reference provides API details and use cases for implementing these data-fetching patterns.

Does TanStack Query v5 require specific TypeScript configurations or dependencies?▼

TanStack Query v5 requires a React project with the @tanstack/react-query package installed. This reference focuses on TypeScript syntax examples, hook options, and related client utilities.

Related Skills

Explore More Software Engineering Skills→
agusmdevagusmdev
5

tanstack-react-query-setup

Configure TanStack Query with QueryClient, provider, and devtools for SSR TanStack Start and SPA TanStack Router projects.

Community
Advanced
Yoriichi-DangYoriichi-Dang

tanstack-query-best-practices

Structure TanStack Query data fetching, caching, and server state in React applications.

Community
Advanced
ynittoynitto
1

react-frontend-unit-tester

Automate frontend unit testing for React components and Zustand stores.

Community
Intermediate
guichefferguicheffer
3

graphql-api

Generate type-safe GraphQL queries and mutations for React with Apollo Client.

Community
Intermediate