Introduction to React
Hooks
Hooks are functions that let you “hook” into React state and lifecycle features from function components. – reactjs.org
Hooks are a new addition to the 16.8 version and enable accessing state and lifecycle without having to write classes. As mentioned earlier, writing class components and accessing the state was somewhat cumbersome. For example, it was difficult to share stateful logic between components. However with the React Hooks extension, we can now use state properties across components without having to change your component hierarchy, and even better without having to write class components;) We strongly recommend you to work with Hooks.
Motivation behind the Hook concept
You can watch the video below if you are interested in the motivation behind the hook update:
There are several Hooks, provided through React. In this course you will learn about the State Hook and the Effect Hook.
Rules
- Only call Hooks at the top level, not inside loops, conditions or inside nested functions
- Only call Hooks from functional components. Do not call them from regular JavaScript functions.