Oferiți exemple de ceea ce se poate face cu hook-ul useEffect, în afară de efectuarea de solicitări către server.

Gestionarea stării titlului paginii (document.title).

Abonarea și dezabonarea de la evenimentele browser-ului (de exemplu, schimbarea dimensiunii ferestrei, clicuri în afara elementului):

useEffect(() => {
  const handleResize = () => {
    console.log('Dimensiunea ferestrei s-a schimbat');
  };
  window.addEventListener('resize', handleResize);

  return () => {
    window.removeEventListener('resize', handleResize);
  };
}, []); // Lista de dependențe goală: efectul se execută o singură dată la montare și se curăță la demontare.

Lucrul cu stocarea locală (citire/scriere de date):

useEffect(() => {
  const savedValue = localStorage.getItem('myInputValue');
  if (savedValue) {
    setInputValue(savedValue); // Se presupune că există o stare inputValue și o funcție setInputValue
  }
}, []); // Încărcarea valorii la montare.

useEffect(() => {
  localStorage.setItem('myInputValue', inputValue); // Salvare la schimbarea inputValue.
}, [inputValue]); // Dependența de inputValue.

Inițializarea bibliotecilor sau componentelor terțe.

Configurarea și curățarea timerelor (setTimeout, setInterval):

useEffect(() => {
  const timerId = setInterval(() => {
    console.log('Timerul funcționează');
  }, 1000);

  return () => {
    clearInterval(timerId); // Curățarea intervalului la demontare.
  };
}, []);

Urmărirea modificărilor în props sau stare și executarea acțiunilor ca răspuns.

Setarea focusului pe un element la montarea componentului:

useEffect(() => {
  inputRef.current.focus(); // Se presupune că există o referință inputRef
}, []);