useEffect Hook Basics

The useEffect hook lets you run side effects in function components. It replaces lifecycle methods like componentDidMount and componentDidUpdate.

import { useEffect, useState } from "react";

function Timer() {
  const [count, setCount] = useState(0);

  useEffect(() => {
    document.title = `Count: ${count}`;
  });

  return <button onClick={() => setCount(count + 1)}>Click {count}</button>;
}
  • Runs after every render by default.
  • Common for API calls, DOM updates, timers, etc.
← PrevNext →