skills.rest
bartolomeomueller
bartolomeomuellerCOMMUNITY
Explore all skills by this author →
GitHub

tanstack-query

Manage client-side server state with automatic caching and background refetching.

Updated Feb 24, 2026
Search Tags:#caching#tanstack#queries#mutations#data-fetching#server-state
One-click install
npx skills add https://github.com/bartolomeomueller/hr --skill tanstack-query-bartolomeomueller
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: tanstack-query
Source: https://github.com/bartolomeomueller/hr/tree/main/.agents/skills/tanstack-query
Command: npx skills add https://github.com/bartolomeomueller/hr --skill tanstack-query-bartolomeomueller

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Manages server state in client applications by providing automatic caching, background refetching, and optimistic updates to keep UI data in sync with a remote source.

Core Features & Use Cases

  • Automatic caching and background refetching for server data.
  • Query and mutation APIs for data fetching, optimistic updates, and invalidation strategies.
  • Real-world use: fetch user data with useQuery, update a list with useMutation, and keep UI synchronized across components.

Quick Start

Install the library, initialize a QueryClient, wrap your app with QueryClientProvider, and start using useQuery to fetch and cache data.

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 and synchronize data in a modern frontend app?▼

You can manage server state by using automatic caching, background refetching, and optimistic updates to keep UI data synchronized with a remote source across components.

How do I fetch and cache server data with query keys and a query function?▼

Fetch and cache server data by defining explicit query keys and a queryFn within the useQuery API, which handles data fetching, caching, and background synchronization automatically.

How do I update remote data and handle cache invalidation after mutations?▼

Update remote data using the useMutation API and manage cache invalidation by configuring mutation lifecycle options to ensure predictable UI synchronization after data changes.

Can I use this server-state management approach with TypeScript and other frameworks?▼

Yes, this server-state management approach supports TypeScript and applies across React and other frameworks, requiring a modern frontend setup to ensure deterministic behavior.

What is the best way to initialize server-state caching before fetching data?▼

The best way to initialize server-state caching is to install the library, create a QueryClient instance, wrap your application with QueryClientProvider, and then start fetching data with useQuery.

When do I need optimistic updates for client-side server state management?▼

You need optimistic updates in client-side server state management when you want to immediately reflect expected data changes in the UI while waiting for the remote mutation to complete.

Related Skills

Explore More Software Engineering Skills→
iEnergyyiEnergyy

tanstack-query

Manage server-state data with automatic caching and background refetching.

Community
Advanced
AgentiveCityAgentiveCity
2

nextjs-data-fetching-and-caching

Configure data fetching and caching in Next.js App Router applications.

Official
Intermediate
SlanyCukrSlanyCukr
2

TanStack Query v5

Manage React server state with data fetching, caching, and background updates.

Community
Advanced
rupamkairirupamkairi

tanstack-query

Manage asynchronous server state in React with caching and refetching.

Community
Advanced