Why should I consider React + Redux?

These are a few points of why I continue to choose React/Redux for new projects and not <insert popular JavaScript library here>. I’ve given other tools a try, and can’t find a good reason to switch to something else, yet :).

React and Redux have a large ecosystem

When evaluating tools, it helps not to view them in isolation. Just as important as the tool itself, is the ecosystem that surrounds it and how active the community is. Avoid statements like, "Vue is smaller than React and performs better". That may be true, but it’s unfair to base your decision on a few quantitative metrics, unless they’re extremely important to you. Most of the time, it’s the stuff that can’t be quantified that really matters in your every-day development cycle.

There are hundreds of libraries within the React and Redux ecosystems. Someone has already created a component for almost anything that you can imagine. There are also a number of UI component libraries with large catalogs of common components. Some of these libraries can help you get up and running quickly without the need for a designer. Along with the number of libraries available, the React/Redux communities are also very active and try to keep things up-to-date.

React’s large ecosystem can also be a disadvantage, however. It can lead to a fragmented set of tools that make it hard to decide when to use one and not the other. Vue.js has a smaller ecosystem, making it a bit easier to know which additional library to use at the appropriate time. However, it still has a long way to go before achieving the level of maturity that React currently has.

Angular, on the other hand, is a framework that provides much of what you need to build an application. Some developers see this as a major benefit, since they don’t have to run around looking for additional tools that play nice with Angular. This is the old “framework vs library” argument. I prefer to use a library, over a framework, because it grants me much more flexibility and freedom.

React uses JSX

JSX empowers developers to approach building web applications in a modular and composable way. Modularity is not unique to React and, in fact, some developers prefer using templates to build components. Templates are nothing new and are the default way of creating components in other popular libraries, and frameworks, such as: Vue.js and AngularJS. However, what I like about JSX is the detachment from standard HTML practices. Building an application with JSX feels more like you’re creating a desktop, or mobile application, than a web application.

Using templates does have its advantages as well. For example, developers can integrate with a designer’s HTML/CSS deliverable far easier using templates than with JSX. This, however, is not enough to convince me to stop using React, since it has been my experience that this is not a very common practice anymore. Most designers deliver Adobe Illustrator or Sketch output instead, requiring developers to start from zero and build up the application.

It’s also worth mentioning that while JSX is a language that ultimately compiles down to JavaScript, it is still very similar to HTML in its syntax. For example, this is valid HTML code: `<div class=”header”></div>`; and this is valid JSX code: `<div className=”header”></div>`. The difference is that in JSX, `class`, is a reserved word so you have to use `className`.

React/Redux scales nicely

It has been my experience that writing a small application in React/Redux is just as complex as writing a very large application. This is both a gift and curse. Setting up a React application requires a significant amount of configuration and knowledge of build tools. Ensuring that you get everything in order can slow down the initial phases of a project. Recently, however, React has helped mitigate this complexity by creating "create-react-app" - a simple tool for creating React applications with no build configuration.

Once your application build is configured and you’re comfortable with the tools, it does not get any more complicated. This is an important point that I think is often overlooked. As your application scales out, and more and more requirements start coming in, it can get overwhelming if you don’t have a great foundation. React, and Redux, provide a platform to scale out applications easily by providing a consistent set of practices that developers unknowingly follow. The React/Redux functional programming paradigm enforces a modular and loosely coupled codebase. This not only encourages consistency, but also code that is much easier to test.