# 🧩 React Lifecycle Hooks

## About React lifecycle turned into dev friendly and readable hooks ## Key Features 🔮 **Simple usage** 🚀 **Fast and light** 💎 **No external dependencies** 🪄 **Increases code readability** 🎊 **SSR Support** ## Installation ```bash npm install --save @better-hooks/lifecycle ``` or ```bash yarn add @better-hooks/lifecycle ``` --- ## Examples ```tsx import React from "react"; import { useDidMount, useDidUpdate, useWillUnmount, useIsMounted, useWillMount, useForceUpdate, useDidChange } from "@better-hooks/lifecycle"; const MyComponent: React.FC = (props) => { const [isOpen, setIsOpen] = React.useState(false) // returns ref with the mounted boolean state const mounted = useIsMounted() // Method for the component rerendering const forceUpdate = useForceUpdate() // Called before mount useWillMount(() => { // ... }) // Called on component mount useDidMount(() => { // ... }) // Called when isOpen change useDidUpdate(() => { // ... }, [isOpen]) // Called when isOpen change but also on mount useDidUpdate(() => { // ... }, [isOpen], true) // Called when dependencies change, we can inspect previous dependencies useDidChange((prevProps) => { if(prevProps[0].value !== props.value) { // ... } }, [props], true) // Called last useWillUnmount(() => { // ... }) return ( // ... ) } ```