Reasons to use React Hooks instead of Classes | WalkingTree Technologies

React Hooks has been around for quite a while but yet not many developers are using it. Mainly because they are already working on a large application that is difficult to move or they are more comfortable in using classes. Let’s take a look into reasons why should go for React Hooks instead of classes.

Refactor a functional component into a class component — Changing from a functional component to a class component requires refactoring, depending on how complex the component is. With React Hooks, functional components have the capability of tapping into the state, the refactoring effort will be minimal.

You don’t have to worry about ‘this’ — If you are familiar with JavaScript, you know that in JavaScript doesn’t work the same in other languages. When it comes to React Hooks, you don’t have to worry about this at all. This is good for beginners as well as experienced developers.

Easier to decouple logic from UI — With React hooks, logic and UI is easier to separate. No need for HOC or render props. Hooks do it elegantly with less boilerplate and more intuitive compositions of UI.

Sharing stateful logic between components — With the class-based approach, it is hard to share stateful logic between various components. Consider two components where both have to fetch, sort, and display data from two different data sources. Even though both components have the same functionality, it is hard to share the logic. With Custom React Hooks you can extract these reusable stateful logics and test them separately.

to know what are the other reasons for choosing React Hooks.

Originally published at https://walkingtree.tech on September 23, 2020.

--

--

--

WalkingTree is an IT software and service provider recognized for its passion for technology.

Love podcasts or audiobooks? Learn on the go with our new app.

Recommended from Medium

Hiding Implementation Details With Flow’s New Opaque Type Aliases Feature

How to Publish NPM Packages

how to use slice() or splice() in JavaScript

getting started with the JavaScript array sort() method

How to Track Calories and Macros With MyFitnessPal https://t.co/9GwzK16mRM

findMin method: Return the position of a string in the array such that that string is <= every…

Webhooks

Picture perfect, you don’t need no filter…

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store
WalkingTree Technologies

WalkingTree Technologies

WalkingTree is an IT software and service provider recognized for its passion for technology.

More from Medium

React Life Cycle Hooks

React State I

Why you should be hooked on React Hooks!

Filter data by category with React Native and Styled-Components.