tanstack-query-best-practices
CommunityMaster TanStack Query for robust async state management.
Software Engineering#typescript#best practices#caching#state management#data fetching#tanstack query#react query
AuthorFujishigeTemma
Version1.0.0
Installs0
System Documentation
What problem does it solve?
This Skill provides a comprehensive guide to writing robust, maintainable, and performant TanStack Query (React Query) code, addressing common pitfalls and promoting best practices.
Core Features & Use Cases
- Optimized Query Definitions: Learn to use
queryOptionsfor better type safety and reusability. - Effective Invalidation: Master strategies for keeping your cache up-to-date with mutations.
- Error Handling & Resilience: Implement robust error handling and optimistic updates.
- TypeScript Integration: Leverage TypeScript inference for type safety.
- Use Case: Refactor existing React Query code to use
queryOptionsfactories, ensuring all queries are properly typed, invalidated, and handle errors gracefully, leading to a more stable and predictable application state.
Quick Start
Use the tanstack-query-best-practices skill to refactor the apps/web/client/src/lib/queries.ts file to use queryOptions-based factories.
Dependency Matrix
Required Modules
None requiredComponents
references
💻 Claude Code Installation
Recommended: Let Claude install automatically. Simply copy and paste the text below to Claude Code.
Please help me install this Skill: Name: tanstack-query-best-practices Download link: https://github.com/FujishigeTemma/listen/archive/main.zip#tanstack-query-best-practices Please download this .zip file, extract it, and install it in the .claude/skills/ directory.
Agent Skills Search Helper
Install a tiny helper to your Agent, search and equip skill from 223,000+ vetted skills library on demand.