Basic React Hooks API

React Hooks API, introduced in React 16.8 thats enables developers to use core features like state management and lifecycle methods directly within functional components, eliminating the need for class components. This makes it easier to manage state and side effects, leading to more concise and readable code.

1. useState: Manages state in functional components.

   const [count, setCount] = useState(0);        

2. useEffect: Handles side effects after rendering, like fetching data.

useEffect(() => { fetchData(); }, []);        

3. useContext: Shares data across the component tree.

const theme = useContext(MyContext);        

4. useRef: Keeps a mutable reference without re-renders.

const inputRef = useRef(null);        

5. useMemo: Memoizes values to improve performance.

const value = useMemo(() => computeExpensiveValue(a, b), [a, b]);        

6. useCallback: Memoizes functions to prevent re-creations.

const onCallback = useCallback(() => { doSomething(); }, [dependency]);        

7. useReducer: Manages complex state logic in functional components.

const [state, dispatch] = useReducer(reducer, initialState);        

8. useTransition: Helps manage UI transitions for smoother updates.

const [isPending, startTransition] = useTransition();        

More Reference: https://react.dev/reference/react/hooks