Learning React Hooks: What are Hooks?

I have recently had the pleasure of graduating from Flatiron a couple of weeks ago and for my final project, I was using React for my frontend. Now, of course, it’s up to me to continue my development and to be constantly learning. There is so much out there to learn and there are so many things I want to do, but I have to start somewhere.

Which lead me to Hooks. Up until now, much of my components would be class components, that would hold my state and pass down props. But with the introduction to hooks in React 16.8, you can use state and other React features without writing a class. Class components were previously the only kind of components that had state in React, the same applied for interacting with an API, say an external API, or a browser API. We needed to use a lifecycle hook, likecomponentDidMount() to reach out to those APIs.

By comparison, functional components were imported for displaying our markup and the data stored in state. We passed down state from class components to be rendered in function components through props and these functions helped us break up our application in a more readable and logical component tree.

Now React Hooks gives to functional components all of the functionality we previously relied on class components for. So why not explore these hooks?