The other day, the React team released a big new feature.
It’s called Hooks.
Or, I should say, they’re called Hooks, because there are a handful of them. But I’m jumping ahead. (I’m kinda excited). Let me take a step back.
What are Hooks?
You know how React class components can hold state, and function components can’t?
And how class components can have lifecycles, and function components can’t?
And how class components can extend
PureComponent, but function components are stuck rendering every single time?
Well – hooks change all that (and technically that last one is solved by the new
React.memo function in 16.6).
Hooks make it possible to take a React function component and add state to it, or hook into lifecycle methods like
componentDidUpdate(see what I did there).
From here on out, if you write a function component, and later decide that it needs a bit of state, you don’t have to refactor the whole thing into a class. Those functions are no longer relegated to being “stateless function components”.