React should become a framework already

Michael De Abreu - Oct 28 '20 - - Dev Community

Photo by Abbilyn Zavgorodniaia on Unsplash

If you'd follow me, you should know that I'm an Angular advocate. Still, that doesn't mean that I don't work with tools other than Angular. In fact, I have been working the last year with React. Previous to this project, I worked for over 6 months about three years ago with React as well. So, I might no be considerer an "expert" in React, but I think I do have enough experience to know what I'm going to write about.

Landscape Review

React was released 7 years ago, with one job, and one job only: To deliver the best UX performance-wise possible. That's why React is a library to manage the UI. Nobody doubts that React did a really good job managing the UI in comparison with the primary competitor it had back then: AngularJS.

Because of the same reason, many of the features that AngularJS has were left out. Some of them could be considered unnecessary by most developers, like built-in services, or directives. Those could be easily replaceable with singletons, and HOC. But, some features like routing, global state, or forms, were so needed that the community quickly got some libraries to fulfill those tasks.

Since the first version of React, we had seen many frontend tools being released and most of them describe themselves as "frameworks", like Angular, Vue, even Next.JS. And why is that? Because they include everything you need to start your development without looking at external libraries. Sure, you could and probably will anyway, but the libraries that you actually require to start the development are little to none. They often offer you everything you need, routing, global state, and forms.

React needs to evolve

Some developers use React to write SPA, but some others don't, some developers use React to write just the view in a server-rendered application, or to write mobile apps with React Native, or desktop apps with Proton or something similar. All of those uses cases should be covered.

The state management has seen a huge improvement with the introduction of hooks. You can now easily develop an application that doesn't require the usage of Redux for state management, you can use use the new Context API to manage global state, and the useContext hook to access that state.

React needs a routing solution out of the box. React Router has been the de facto router to React and having one library is a good thing. But, because you have other solutions that you could choose, if I want to build something around the routing, for example, a library to manage routed modal, I can't assume you will use React Router. It would be different if React had a library to manage the routing. Because I would know that you'll probably use that.

React also needs form management. If with routing we have a de facto solution, with forms we have so many options, that I've seen peers in other projects literally doing their own way to manage the state of the form. If I require an Angular developer for a project, I would expect they use Angular Forms. But, with React, I can't have the same expectation, because we have tens of libraries that do the same. But, if React had some library or features, that improves the form management, its usage would be expected.

What would that mean to the current React ecosystem?

In my opinion, improvement, and consistency. Right now, there are just too many steps involved in creating a React Stack framework to work with. You need all those other tools, even for the simplest SPA, you need routing, state, and forms management.

This would also mean a better developer experience. Right now, if you have a React Stack in one project, and you go to another one, you will probably have to learn everything again. That wouldn't happen if React has all the tools you need. Your knowledge would be consistent across projects.

And, of course, better integration with React itself. Because the React teams know the inners and outers of React, and they can take advantage of it. How easy could be for them to develop a two-way data binding or hooks that improves forms management*?

That's all folks

I hope you enjoy this, and I'm really looking forward to sharing some comments with you. Take care, and take care of your loved ones. Bye-bye!

  • I'm sorry if it seems like I'm really pushing the forms thing trough, but if you had managed forms with Angular, you know already how easy it is to manage them, and is something that comes with the framework. Vue also has a great two-way data binding feature that allows you to model the data as you want. With React, you have to deal with synthetic events and other things that make it "no so good", in my opinion.
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .