skills.rest
AleksanderEvensen
AleksanderEvensenCOMMUNITY
Explore all skills by this author →
WebsiteGitHub

tanstack-query

Manage React server state with TanStack Query v5 data fetching.

Updated Jan 21, 2026
Search Tags:#caching#state management#react#data fetching#tanstack query#ssr
One-click install
npx skills add https://github.com/AleksanderEvensen/homelab --skill tanstack-query-aleksanderevensen
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: tanstack-query
Source: https://github.com/AleksanderEvensen/homelab/tree/main/admin-panel/.agents/skills/tanstack-query
Command: npx skills add https://github.com/AleksanderEvensen/homelab --skill tanstack-query-aleksanderevensen

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) and rules (resource) components.

What problem does it solve?

This Skill helps developers efficiently manage server state in React applications, simplifying data fetching, caching, and synchronization, especially during complex migrations or when building offline-first applications.

Core Features & Use Cases

  • Modern Data Fetching: Implement advanced data fetching patterns with TanStack Query v5, including useMutationState, optimistic updates, and throwOnError.
  • Migration Assistance: Resolve common migration issues from v4 to v5, such as object syntax changes, gcTime vs cacheTime, and isPending state.
  • Offline & SSR Support: Configure network modes for PWA support and debug Server-Side Rendering (SSR) and hydration issues.
  • Use Case: When migrating a large React application from React Query v4 to v5, use this Skill to understand breaking changes, apply necessary code transformations, and ensure seamless data fetching and state management.

Quick Start

Use the tanstack-query skill to set up the QueryClientProvider with ReactQueryDevtools in your main application file.

Frequently Asked Questions about tanstack-query

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

FAQPage Schema
How do I migrate React Query from v4 to v5 and fix breaking changes?▼

Migrate React Query v4 to v5 by updating object syntax, renaming cacheTime to gcTime, and replacing isLoading with isPending. This ensures seamless data fetching and server state management in React applications.

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

Implement optimistic updates in TanStack Query v5 using useMutationState to manage mutation states. This allows you to update the UI immediately before the server response arrives, improving perceived performance for complex client-side applications.

What is the best way to debug SSR and hydration issues with TanStack Query?▼

Debug SSR and hydration issues in TanStack Query by configuring QueryClientProvider correctly and ensuring proper server-side data prefetching. This prevents hydration mismatches and synchronizes server state efficiently during client rendering.

Can I use TanStack Query v5 to build offline-first React PWA applications?▼

Yes, TanStack Query v5 supports offline-first React PWA applications by configuring network modes for offline support. This allows data fetching and caching to continue functioning during network interruptions, synchronizing when connectivity is restored.

How does TanStack Query handle server state caching differently than local state management?▼

TanStack Query handles server state caching by automatically fetching, caching, and synchronizing remote data, unlike local state management which tracks client-side variables. This separation simplifies asynchronous data management and prevents stale data in React.

Related Skills

Explore More Software Engineering Skills→
WalshingtonWalshington

tanstack-query

Manage server-state in React apps with TanStack Query v5 object-syntax hooks.

Community
Advanced
zinohomezinohome
1

tanstack-query-setup

Implement TanStack Query for server state management in React applications.

Community
Advanced
Camilo8902Camilo8902

tanstack-query-setup

Implement TanStack Query for server state management in React applications.

Community
Intermediate
PMKhaiPMKhai

react-data-fetching

Fetch, cache, and synchronize server data in React applications with TanStack Query.

Community
Advanced