What is a Hook in React?
Hooks are functions that let you “hook into” React state and lifecycle features from function components. React provides us with built-in hooks. For example, useState is a function that lets you use state in functional components.
When would using hooks be useful?
If you are writing a functional component and need to add state to it, instead of converting the component into a class component you can use Hook inside the functional component.
The useState Hook
The useState hook is the most used hook in the framework. useState declares our state variable. It is the same way to use capabilities that this.state provides in a class.
The only argument to the useState() hook is the initial state. useState returns a pair of values, which are the current state and the setter, which is a function that updates the state.
The useEffect Hook
The useEffect Hook lets you perform effects into functional components. Fetching data and changing the DOM in React are examples of side effects. By using this hook, we tell React that our component needs to do something after render. React will remember the effect passed down and call it after performing the DOM updates. useEffect is called inside of the component and lets us access the state variable right from the effect.
Conclusion
Hooks are a new addition in React 16.8. They let you use state and other React features without writing a class. They are very useful, they allow you to reuse stateful logic without changing component structure.