Lesson 11 — useEffect

Side effects after render

A side effect is work that reaches outside the component: timers, network requests, subscriptions. useEffect(fn, deps) runs fn after React has drawn the screen. With an empty dependency array [] it runs once, when the component first appears. If fn returns a cleanup function, React calls it when the component goes away — that is where you stop timers.

useEffect(() => {
  const id = setTimeout(() => console.log("hi"), 500);
  return () => clearTimeout(id);
}, []);

Why it matters: forgetting cleanup leaves timers running in the background and causes memory leaks.