tanstack-query-expert
Expert in TanStack Query (React Query) — asynchronous state management. Covers data fetching, stale time configuration, mutations, optimistic updates, and Next.js App Router (SSR) integration.
Profile →npx skills add sickn33/agentic-awesome-skills --skill tanstack-query-expert --agent claude-code
Same command for any agent — swap --agent for codex, cursor, copilot.
Weekly change comes from our own snapshots, not the repository page — it measures attention, not adoption.
# TanStack Query Expert You are a production-grade TanStack Query (formerly React Query) expert. You help developers build robust, performant asynchronous state management layers in React and Next.js applications. You master declarative data fetching, cache invalidation, optimistic UI updates, background syncing, error boundaries, and server-side rendering (SSR) hydration patterns. ## When to Use This Skill - Use when setting up or refactoring data fetching logic (replacing `useEffect` + `useState`) - Use when designing query keys (Array-based, strictly typed keys) - Use when configuring global or query-specific `staleTime`, `gcTime`, and `retry` behavior - Use when writing `useMutation` hooks for POST/PUT/DELETE requests - Use when invalidating the cache (`queryClient.invalidateQueries`) after a mutation - Use when implementing Optimistic Updates for instant UX feedback - Use when integrating TanStack Query with Next.js App Router (Server Components + Client Boundary hydration) ## Core Concepts ### Why TanStack Query? TanStack Query is not just for fetching data; it's an **asynchronous state manager**. It handles caching, background updates, deduplication of multiple requests for
- When to Use This Skill
- Core Concepts
- Why TanStack Query?
- Query Definition Patterns
- The Custom Hook Pattern (Best Practice)
- Advanced Query Keys
- Mutations & Cache Invalidation
- Basic Mutation with Invalidation
- Optimistic Updates
- Next.js App Router Integration
- Initializing the Provider
- Server Component Pre-fetching (Hydration)
- Best Practices
- Troubleshooting
What does the tanstack-query-expert skill do?
Expert in TanStack Query (React Query) — asynchronous state management. Covers data fetching, stale time configuration, mutations, optimistic updates, and Next.js App Router (SSR) integration.
How do I install it?
Run `npx skills add sickn33/agentic-awesome-skills --skill tanstack-query-expert --agent claude-code` — it drops the skill into your project so the agent can pick it up. Swap the --agent value for codex, cursor or copilot if you use one of those.
Where does this skill come from?
From sickn33/agentic-awesome-skills, a repository with 44,414 stars. We read it straight from the repository tree rather than a submitted listing, so what you see here is what is actually published.
Is a popular skill a good skill?
Not necessarily. Stars measure attention, not adoption — a repository can trend for a week and be abandoned. That is why we show the weekly change from our own snapshots next to the total, instead of a single flattering number.