Published on

useLogger Hook React

useLogger Hook React

useLogger Hook React

useLogger Code and Usage

useLogger is a hook to log the lifecycle of a component.

import { useEffect } from "react";

const useLogger = (componentName) => {
  useEffect(() => {
    console.log(`${componentName} has mounted.`);

    return () => {
      console.log(`${componentName} will unmount.`);
    };
  }, [componentName]);
};

// Usage
const LoggerExample = () => {
  useLogger("LoggerComponent");

  return (
    <div>
      <p>This component logs lifecycle events to the console.</p>
    </div>
  );
};