DEV Community

loading...
Cover image for Do you still use React classes?

Do you still use React classes?

madza profile image Madza ・1 min read

Back in February 2019, React 16.8. introduced Hooks, a new way of using state and other React features without writing a class.

As of November 2020, the class syntax is still supported, and React official documentation states there are no plans to remove classes from React.

Do you still maintain some code where you have to use React classes? What about the projects you create from the ground-up?

Discussion

pic
Editor guide
Collapse
bias profile image
Tobias Nickel

I think classes are the second best way to build react apps.

I think react got off from very good track. Initially, it was about render functions. functions that are pure and easy to reason about. there was the formular of data + render = UI.

when react in troduced classes, it is the first vialation of that formular. at least with the classes it is clear where the state is.

today having functional components with react hooks, now the state is somewhere, inside the framework. A pain in the ass for debugging. and reasoning why the ui shows what it shows get harder and harder.

Here I am speaking as a big fan of redux, working hard to have less magic and more clarity in the code.

yes, for statefull components I still prefer classes.

Collapse
ivanjeremic profile image
Ivan Jeremic

Hooks are perfect for state and I know exactly where they are, just because classes are the first thing you learned doesn't mean you have to give up and use still classes, hooks are just so much better and cleaner there is no reason to compare them.

Collapse
buriti97 profile image
buridev

I think typescript works better with hooks than classes too. that's is my opnion:)

Collapse
bias profile image
Collapse
hymanaharon profile image
Aharon Hyman

I was just about to comment when I saw this. A lot of our app is built with classes and Redux. When working with bigger projects and bigger data calls I find classes handle the state in a way that is cleaner to debug.
I will often have a data layer that is Class and a the children are functional for this reason. But it is really personal preference .
I would also like to add a good developer knows all the tool available to them and is able to chose the correct one for the job, using only functional components and hooks because they are new and cool is not always the best way to go.

Collapse
myzel394 profile image
Myzel394

I don't use classes anymore because I want my code to be as modern as possible and I don't want to stay on the "old" technology, because 1) there would be no development in technology otherwise and 2) I wouldn't learn anything new.

Collapse
beggars profile image
Dwayne Charrington

Classes may not be a "modern" concept to React land, but classes are anything but unmodern. Classes are part of the ECMAScript specification, they are very much a real and implemented language-level feature. The React team spread a lot of dangerous and unsubstantiated rhetoric when they blamed classes for problems caused by their ineptitude.

Collapse
crowdozer profile image
crowdozer

I do have quite a few class based components laying around in my code, but I've almost exclusively used functional components ever since hooks released. I don't go out of my way to refactor class based components into their functional counterparts, but I won't write a class based one unless it's absolutely necessary. There are a few packages I depend on that require class based components to function properly. The use case is so far and few between though.

To be honest with you, when I'm asked to make a change to a particular feature and I open up the file and see a big ol class... it scares me a little.

Collapse
developerantoniosousa profile image
Antonio Sousa

I'm using class component only on old components - existing components. Creating new components always I write components using Hooks API, because it's clearer and easy to use. There are quite benefits over the Hooks API which can show when put it on practice.

Collapse
sfiquet profile image
Sylvie Fiquet

I'm writing new code with hooks. My old projects still have classes. They work perfectly fine, why waste time changing them? In general I'd only convert working code when the benefits outweigh the cost.

I've never really liked having two types of components. I've had several cases when adding a new functionality meant moving the state up or down the hierarchy. Refactoring a class component into a function component (or vice versa) is a pain. At least with hooks it's not an issue anymore. I'm not 100% comfortable with the magic behaviour that come with hooks but I like having code that refactors easily.

Collapse
napoleon039 profile image
Nihar Raote

Ever since Hooks were introduced, I have used them instead of classes. For me, I like the way useState initializes and updates the state. This is a personal preference, but I like using functional components more than classes. This does not mean I have a problem with class-based components or hate them.

I do use classes occasionally. Especially when something needs to be done after a component has been unmounted or when the component is updated. I still can't get around to using useEffect well. I find componentWillUnmount and componentDidUpdate easier to use.

As for which one is better, I think both get the job done when it truly matters. It all depends on whether a library needs classes or the developer prefers one over the other.

Collapse
groundhogs profile image
Ground Hogs

I ocasionally do, although it's gotten more and more annoying and useless with the largest amount of development trending towards plain functions everywhere.

The thing I miss the most is the general idea of knowing exactly on which part of the lifecycle I was on any given code block. Been thinking for a while about making a bunch of lifecycle hooks, as in, actual hooks that look like React Hooks and map to different points in a component's life; that way we could regain some of that sense of control, even if it's only useful for dev experience.

Collapse
gkhan205 profile image
Ghazi Khan

I'm using mix of both. All my child components are Functional components with hooks and Container components where I need some more states to be managed and need to use some lifecycle methods extensively then only I use Class component if not then Functional component with hooks there too.

Collapse
Sloan, the sloth mascot
Comment deleted
Collapse
sphrases profile image
Collapse
ivanjeremic profile image
Ivan Jeremic

I use Hooks everywhere.

Collapse
mapleleaf profile image
MapleLeaf

Classes are dead to me 🙃

Collapse
super_quack profile image
Jefferson Ferreira

I'm still a newbie and only used classes a few times while I didn't knew how to use useEffect()

Collapse
karanpratapsingh profile image
Karan Pratap Singh

Personally no but I still see them in lot of codebases, feels nostalgic haha

Collapse
niel_morphius profile image
Moses Daniel Kwaknat

I just use both, depends on my mood.

Collapse
dev1031 profile image
Dherendra Dev

yes sometimes...

Collapse
nasacodes profile image
Collapse
andrioid profile image
Andri

At least for ErrorBoundary. For Containers, they are worth considering. But for everything else, there's function components.

Collapse
ivanjeremic profile image
Ivan Jeremic

No thanks god!