Module 2 · State, effects and live data Lesson 5 of 15
useEffect and fetching an API
An effect runs after render, which is where fetching belongs. The empty dependency array means "once when the component appears" — and the cleanup function is what stops a request from writing into a screen that is gone.
Worked example
A fetch inside useEffect with an array dependency of [] loads once. Dropping the array reloads on every render, which is how a free API quota disappears in two minutes.
Your practice task
Fetch a public list of jobs or films, render it, and add a search box that filters what you already have instead of refetching.
Do this before moving on. Reading a solution teaches the shape of it; typing it teaches you.
Key takeaway
An effect runs after render, which is where fetching belongs. The empty dependency array means "once when the component appears" — and the cleanup function is what stops a request from writing into a screen that is gone.
Keep your place in this course
A free account saves which lessons you have finished and unlocks the certificate. The lesson itself stays free to read.
Create free account or sign inCourse complete
You finished every lesson.
Your certificate is ready, and the projects you built are the proof to attach to an application.
Almost there
15 lessons left of 15
Finish every lesson to unlock the certificate. Each one ends in a practice task — do them and the final project brief writes itself.