{"enrichment":{"faq":[{"a":"state-management teaches useQuery for fetching and caching server data with automatic background refetching, and useMutation for handling create/update/delete operations. useQuery accepts a query key and async function, returning data, loading, and error states. useMutation lets you trigger changes and handle onSuccess/onError callbacks for side effects like cache invalidation or optimistic updates.","q":"How do you use useQuery and useMutation in state-management?"},{"a":"state-management distinguishes server state (fetched data managed by React Query) from client state (UI preferences, forms managed by Zustand). Server state requires caching, synchronization, and invalidation strategies. Client state is local and doesn't need network sync. Combining both libraries lets you handle each appropriately: React Query for server concerns, Zustand for client-only values.","q":"What's the difference between server state and client state in state-management?"},{"a":"state-management covers cache invalidation strategies using queryClient.invalidateQueries() to mark queries stale after mutations, triggering refetches. Query keys are organized hierarchically for precise invalidation. The skill teaches cache time configuration, stale time tuning, and when to use background refetching versus immediate invalidation for optimal UX.","q":"How does state-management handle react query caching and invalidation?"},{"a":"state-management shows creating typed Zustand stores with TypeScript interfaces for state and actions. Stores use create() to define state, getters, and setters. The skill covers selectors for preventing unnecessary rerenders through shallow comparison, persist middleware for localStorage, and combining multiple stores for complex applications.","q":"How do you set up Zustand store with TypeScript in state-management?"},{"a":"state-management covers optimistic updates by updating cache immediately before server confirmation, rolling back on error. You use queryClient.setQueryData() to update cache, then revert if the mutation fails. This pattern improves perceived performance. The skill also covers mutation callbacks (onSuccess, onError) for cache invalidation and side effects.","q":"What optimistic updates does state-management teach for React Query?"},{"a":"state-management teaches integrating React Query for server data and Zustand for client state in one architecture. React Query handles fetching, caching, and synchronization; Zustand manages UI state, preferences, and auth tokens. The skill covers using Zustand's persist middleware for hydration and coordinating invalidation between both libraries for consistent state.","q":"How does state-management combine React Query with Zustand?"}],"shadow_tags":["server-state-management","client-side-stores","data-fetching-patterns","cache-invalidation","optimistic-ui-updates","typescript-store-patterns","query-key-organization","persistence-middleware","performance-optimization"],"summary_rewrite":"Master server-side data fetching and caching with React Query v5, plus client state patterns using Zustand v5. This skill covers query setup, cache invalidation, mutations, optimistic updates, and combining both libraries for complete state control."},"files":[{"bytes":12404,"path":"skills/state-management/SKILL.md","sha256":"1e736c13a3b92e7ae7ee6eb6d1f440fa42c88d8beb6b917723b11693d81d417a","url":"https://skillfed.io/files/AsyrafHussin/agent-skills/state-management/900bcca0/SKILL.md"}],"id":"AsyrafHussin/agent-skills/state-management","links":{"html":"https://skillfed.io/AsyrafHussin/agent-skills/state-management","md":"https://skillfed.io/AsyrafHussin/agent-skills/state-management.md","repo":"https://github.com/AsyrafHussin/agent-skills"},"meta":{"agents_supported":[],"first_seen":"2026-07-28","forks":9,"language":null,"last_updated":"2026-05-16","license":"MIT","name":"state-management","publisher":"AsyrafHussin","stars":58},"relations":{"similar":[{"id":"secondsky/claude-skills/tanstack-query"},{"id":"bobmatnyc/claude-mpm-skills/tanstack-query"},{"id":"Mindrally/skills/react-query"},{"id":"patricio0312rev/skills/zustand-state-builder"},{"id":"oakoss/agent-skills/tanstack-query"},{"id":"Mindrally/skills/tanstack-query"},{"id":"Gentleman-Programming/Gentleman-Skills/react-native"},{"id":"duck4nh/antigravity-kit/state-management-expert"},{"id":"tanstack-skills/tanstack-skills/tanstack-query"},{"id":"pluginagentmarketplace/custom-plugin-react-native/react-native-state"}]},"slug":{"owner":"AsyrafHussin","repo":"agent-skills","skill":"state-management"},"version":"900bcca0"}