effectsCleanUp.jsx

function App() {
  const handleScroll = useCallback(() => {
    console.log(window.scrollY);
  }, []);
  
  useEffect(() => {
    // subscribe to scroll event
    window.addEventListener('scroll', handleScroll);
    
    return () => {
       // CLEANUP FUNCTION
       // unsubscribe scroll event
       // when component unmounts
       window.removeEventListener('scroll', handleScroll);
    };
  }, []);
  
  return (
    <div>Hello</div>
  );
}