Data Fetching Patterns
Implements SWR-based data fetching and caching patterns for API interactions, custom hooks, and state management.
The source repository doesn't declare a license. Check its terms before reusing the code.
Key features
- Guidance on creating custom SWR hooks for specific API endpoints.
- Strategies for caching, revalidation, polling, and prefetching.
- Implementation examples for optimistic updates and data mutation.
- Patterns for handling loading, error, and empty data states.
- Instructions for setting up and using mock data and API routes for development.
Use cases
- Building a new component that needs to fetch data from an API.
- Implementing features that update server data, such as submitting a form.
- Refactoring existing data-fetching logic to align with project standards.
FAQ
When should I use this skill?
Use this skill whenever you are interacting with APIs. It's ideal for creating custom data hooks, managing loading and error states, implementing optimistic updates for a better user experience, or setting up mock data for development.
How does this skill improve my workflow?
It accelerates frontend development by providing standardized, best-practice patterns for common data fetching tasks. This reduces boilerplate code, improves app performance with smart caching, and ensures consistent, robust API interaction handling.
What capabilities does it provide?
It provides comprehensive patterns for custom SWR hooks, state management (loading, error, empty), optimistic UI updates, advanced caching (polling, prefetching, revalidation), pagination, infinite loading, and mock API setup.
What does this skill do?
This skill provides expert guidance and code patterns for implementing SWR (stale-while-revalidate) data fetching in modern web applications. It covers everything from basic fetching and custom hooks to advanced caching and mutation strategies.