React Query Pattern
Server state management with TanStack Query for caching, synchronization, mutations, and optimistic updates.
What's Included#
- Query client setup with provider and DevTools integration
- Basic and parameterized queries with useQuery and conditional fetching
- Mutations with cache invalidation and optimistic update rollback
- Infinite queries for cursor-based pagination and infinite scroll
- Prefetching on hover and in Server Components with HydrationBoundary
- Type-safe query key conventions and stale time configuration
Usage#
Via CLI#
Loading code block...
Via AI Assistant#
Ask your AI assistant:
- "Use the React Query pattern from Bootspring"
- "Apply the Bootspring React Query pattern to my project"
Key Considerations#
- Establish consistent query key naming conventions for predictable cache invalidation
- Set appropriate stale times to balance data freshness against network requests
- Always handle loading and error states with meaningful UI feedback
- Invalidate queries strategically after mutations; avoid over-invalidation
- Use React Query for server state and Zustand for client-only UI state