fetching-data-correctly

What problem does it solve?

This Skill prevents common and frustrating issues like race conditions, stale data, memory leaks, and broken optimistic updates when fetching data in React or Next.js applications.

Core Features & Use Cases

• Prioritizes Modern Fetching: Recommends Server Components in Next.js or TanStack Query in React SPAs over raw useEffect fetches.
• Race Condition Prevention: Provides patterns to abort previous requests when new ones are initiated.
• Optimistic Update Handling: Details the correct pattern for optimistic updates, including rollback mechanisms.
• Use Case: Ensure your user sees immediate UI feedback after creating a new item, with a robust fallback if the server operation fails.

Quick Start

Use the fetching-data-correctly skill to fetch data for a product with ID 123 using TanStack Query.