What are Custom Hooks in React?

Create a useDocumentTitle Hook

Build a Custom Hook that sets the document title dynamically based on a string parameter.

Expected output: A hook that updates the browser tab title when used in a component.

Hint: Use useEffect to update document.title when the parameter changes.

Refactor Counter Logic into a Custom Hook

Extract the state and increment logic from a counter component into a reusable Custom Hook.

Expected output: A Custom Hook that manages counter state and can be reused in multiple components.

Hint: Use useState inside the hook and return the count and increment function.

A Custom Hook is a reusable function in React that starts with 'use' and allows you to share stateful logic between components by using built-in hooks like useState and useEffect.

Prefixing with 'use' lets React identify them as hooks and enforce the rules of hooks, such as only calling hooks at the top level.

No, Custom Hooks do not render UI. They only encapsulate logic and return data or functions to be used by components.