React · Exercise 1 of 6Next
Beginner
Load a user in an effect
fakeFetchUser(7) returns a promise of { id: 7, name: "Asha" } after 500 ms. Load it when Profile appears, using useState and useEffect.
While loading, show <p id="status">Loading...</p>. When the user arrives, show <h2 id="name"> with the name instead (and no status paragraph).
The user must be requested once, not on every render.
What Check tests
- While loading,
#statussays Loading... - After the response,
#nameshows Asha and the status is gone - The fetch happens in
useEffect - The user is requested exactly once
Stuck? One hint at a time
The solution unlocks after your first Check. Try first: that is where the learning happens.
Runs in your browser. Your code is saved here.
Your page
Press Run to see the page.
Console
Nothing logged yet.