What is useEffect used for and how do you avoid common pitfalls with dependency arrays?

useEffect runs side effects after render—data fetching, subscriptions, DOM sync, logging. The dependency array tells React when to re-run: [] runs once after mount (in Strict Mode dev, setup may run twice intentionally), omitting deps runs every render, and listing values reruns when they change by Object.is.

Return a cleanup function to unsubscribe or cancel work. Pitfalls include stale closures from missing deps, infinite loops from unstable object/array identities created inline, and fetching without cancellation for rapid navigations.