Reasons To Use React Hooks

Vincent Collis
2 min readMar 14, 2021

React is an open-source JavaScript library developers use to build user interfaces or UI components. It is was created by Facebook in 2013 and is still maintained by them.

Today React JS is arguably the most popular JavaScript library for building User Interfaces. It allows developers to quickly build modern, fast Single Page Applications or websites that scale.

Hooks is a newer feature introduced in the React 16.8 version. It allows you to use state and other React features without writing a class!

Hooks are the functions which “hook into” React state and lifecycle features from function components.

Once I discovered hooks, my React developing experience dramatically increased. So here are three reasons why you should use React Hooks.

Refactoring is simpler as your App grows

Managing State in React is 90% of the battle while developing. Using constructors and advanced functions like ComponentDidMount can be cumbersome and confusing. React Hooks allows our functional components to tap directly into State, which reduces many lines of code and even opens you up to state management systems like Redux!

We get to cancel this

Using this properly is literally the most confusing aspect of React, and it trips up even the most experienced developers. Because JavaScript classes are actually syntactic sugar, the this keyword does not work the same as it does in another programming languaging and never naturally fit into Javascript.

Hooks allow us to cancel this out of our code!.

We can separate our logic

When using classes in React, It is hard to reuse stateful logic between components. This is because, in a Class-based system, we are relying on High Order Components to provide instruction to other functions. Unfortunately, when your app scales and you need to adjust how a function calculates some data, it will destroy your app’s process, forcing a top-down refactor.

With React Hooks, our logic lives in functional components that live independently of one another, allowing developers to inject updates up and down the code with little need to refactor due to new side effects!

--

--