useEffect Example.js

import React, { useState, useEffect } from 'react';

const ExampleComponent = () => {
  const [data, setData] = useState(null);
  const [count, setCount] = useState(0);

  useEffect(() => {
    // Fetching data from an API
    fetch('https://api.example.com/data')
      .then(response => response.json())
      .then(data => setData(data));

    // Updating the document title
    document.title = `Count: ${count}`;

    // Adding an event listener
    const handleClick = () => {
      setCount(prevCount => prevCount + 1);
    };
    document.addEventListener('click', handleClick);

    // Subscription management
    const subscription = externalService.subscribe(() => {
      // Do something with the received data
    });

    // Cleanup operation when the component unmounts
    return () => {
      document.removeEventListener('click', handleClick);
      subscription.unsubscribe();
    };
  }, [count]);

  // Render the component
  return (
    <div>
      <p>Data: {data}</p>
      <p>Count: {count}</p>
      {/* ... */}
    </div>
  );
};

export default ExampleComponent;