What problem does it solve?
Managing data fetching, caching, loading states, and error handling in modern web applications can be complex and lead to inconsistent user experiences. This skill provides a comprehensive guide to SWR-based data fetching patterns, ensuring efficient, robust, and consistent API interactions across the monorepo.
Core Features & Use Cases
- SWR-Powered Data Management: Covers basic SWR usage, custom hook patterns, and advanced configurations for caching, revalidation, polling, and infinite loading.
- Robust Error & Loading States: Guides on implementing graceful loading indicators, comprehensive error handling in components, and global error management.
- Mock Data & Mutations: Explains how to set up mock data for development, implement optimistic updates, and manage data revalidation after mutations.
- Use Case: When building a new feature that displays data from an API, use this skill to create a custom SWR hook, implement skeleton loaders for loading states, and provide clear error messages if the fetch fails.
Quick Start
Create a custom SWR hook to fetch user information from /auth/api/v1/user-info.
import { useUserInfo } from './hooks/useUserInfo'; const { user, isLoading, error } = useUserInfo();
