Skip to content

About

No description, website, or topics provided.

Resources

Stars

0 stars

Watchers

0 watching

Forks

Repository files navigation

Fetching data in useEffect: the race condition (the real app behind the video)

npm install
npm run dev        # http://localhost:5173

Click Alice, then quickly click Bob. With Profile.v1.jsx in place, the heading says Bob but the card ends up showing Alice: her response is slower, lands last, and overwrites Bob's. Open DevTools › Network (Fetch/XHR) to watch the two requests race.

  • vite.config.js serves a tiny API, GET /api/users/:id, from api/users.json. Alice's answer is delayed by 2 s on purpose (everyone else: 0.4 s), so the race happens every time. Real networks do this at random.
  • src/versions/ holds each step of the story (see its README). src/Profile.jsx is whichever version was copied in last (the finished app: v3, AbortController).

Sources: react.dev, Fetching data with Effects · You Might Not Need an Effect › Fetching data · MDN, AbortController

About

No description, website, or topics provided.

Resources

Stars

0 stars

Watchers

0 watching

Forks

Releases

Packages

Contributors

Languages