Q.What are hooks?
1.Hooks are the new feature introduced in the React V16.8.0 version.
2.Hooks are functions that let you “hook into” React state and lifecycle features from function components.
3.Hooks don’t work inside classes — they let you use React without classes.
Hooks are backward-compatible, which means it does not contain any breaking changes.
Also, it does not replace your knowledge of React concepts.
Q.when to use Hooks?
If you write a function component and realize you need to add some state to it, previously you had to convert it to a class. Now you can use a Hook inside the existing function component.
2.Rules for React Hooks:
React Creators provided a linter plugin to enforce these rules automatically:
1. Only call Hooks at the top level:
Don’t call Hooks inside loops, conditions, or nested functions. Instead, always use Hooks at the top level of your React function, before any early returns. By following this rule, you ensure that Hooks are called in the same order each time a component renders.
2. Only call Hooks from React functions:
✅ Call Hooks from React function components.
✅ Call Hooks from custom Hooks.
3.Pre-requisites for React Hooks:
1.Node version 6 or above
2.NPM version 5.2 or above
3.Create-react-app tool for running the React App
4.React Hooks Installation:
There is no separate command to install hooks in react, Instead we need to use the latest React version which supports the hooks feature.
npm install firstname.lastname@example.org –save
npm install email@example.com –save
The above command will install the latest React and React-DOM alpha versions which support React Hooks.
how to check react versions?
The package.json file lists the React and React-DOM dependencies as given below.
5.React Build-in Hooks:
Here, are the APIs for the built-in Hooks in React. The built-in Hooks can be divided into two parts,
Lets discuss all the hooks one by one…