Fetching Basics in Effects (Abort & Cleanup)
Fetch data inside effects with loading/error states; use AbortController and cleanup to cancel in-flight requests on unmount or dependency change.
Why fetch in effects
Goal: Fetch safely inside useEffect: track loading/error, and abort requests during cleanup.
- Effect triggers fetch
- Set state when done
- Cancel when leaving
Loading/Error/Data pattern
Use three small pieces of state: data, loading, and error. Start loading=true, clear error, then set either data or error.
All lessons in this course
- Effects vs Render, Dependencies & Cleanup
- Common Pitfalls: Stale Closures & Missing Deps
- Fetching Basics in Effects (Abort & Cleanup)