Does this skill support the latest version of TanStack Query?

Yes, the patterns follow modern naming conventions and features used in TanStack Query v5, such as gcTime and specialized hooks.

Can it implement optimistic UI updates?

Yes, it includes detailed patterns for onMutate, onError, and onSettled callbacks to provide instant feedback while maintaining data integrity.

How does it help with cache management?

It provides structured Query Key Factory patterns that make it easy to invalidate specific groups of queries or clear related data across the application.

Does it support React Suspense?

Absolutely. It includes patterns for useSuspenseQuery and useSuspenseQueries for modern, declarative loading states.

React Query Patterns

Name: React Query Patterns
Author: bradtaylorsf

bybradtaylorsf

•

API開発

Implements standardized TanStack Query patterns for efficient data fetching, caching, and state synchronization in React applications.

This skill provides Claude with a comprehensive set of best practices and implementation patterns for TanStack Query (formerly React Query). It covers essential workflows including basic and dependent queries, mutations with optimistic updates, structured query key management, pagination strategies, and advanced features like Suspense and prefetching. It is particularly useful for frontend developers looking to reduce boilerplate code and implement robust server-state management that handles loading, error, and caching states automatically with production-grade consistency.

主な機能

01Standardized query key factory patterns for predictable cache management

02Advanced mutation workflows including optimistic updates and rollback logic

036 GitHub stars

04Implementation of both offset and infinite scroll pagination patterns

05Integration with React Suspense for declarative data fetching

06Global and component-level error handling and cache invalidation strategies

ユースケース

01Building complex data-driven dashboards with nested or dependent API calls

02Implementing high-performance lists with infinite scrolling and prefetching on hover

03Managing form submissions with optimistic UI updates to improve perceived latency

What are Skills?·How to Install

Install with 🐟 Skill.Fish

npx skillfish add bradtaylorsf/alphaagent-team react-query-patterns

For use in Claude.ai and ChatGPT

Download Skill