To enhance server-driven web apps, React’s flexible nature is a game-changer
Its popularity is well-earned, though. After years of struggling with straight DOM manipulation via jQuery or vanilla JS, or wrestling with unwieldy “full-stack” frameworks like AngularJS, React feels like a dream. Instead of wrangling logic and layout in separate files, using and maintaining custom attributes, or writing function after function to manage DOM changes, React’s JSX syntax permits you to describe how the layout should look like at any given state using syntax which looks almost like HTML. This is an important distinction.
JSX is not HTML. It’s better.
JSX is syntactic sugar for functions which compile to React classes. React is a library for composing those functions into easily reusable components. Everything in React is a component, and every component is ultimately just a function. This is a brilliant architectural decision. When everything on the page is just a function, we are permitted tremendous freedom to compose the page in virtually any way, using small chunks of code which can reused indefinitely.
I’ve spent roughly two years working with React. Oddly enough, most of that work has not been spent on single-page applications, even though Mission Data has created several of these using Redux and React Router. Instead I have concentrated on incorporating it into more traditional server-rendered Rails applications. In my opinion, this highlights one of the greatest strengths of React: unlike full frameworks like Angular, Ember or Backbone, the core React library is just for rendering views — anywhere you want them. With a little help from React On Rails, dropping a component into an ERB template is as straightforward as any other view helper.
Ultimately, though, the benefits outweigh the negatives. Having the capability to create rich interactive controls and apply them anywhere I need them provides me tremendously more freedom when designing interfaces, and allowed me to execute those interfaces exactly as envisioned. React is a tool I look forward to using because at a base level it feels simple despite being incredibly deep and flexible.
Aside: if you are interested in using TypeScript, I highly recommend Visual Studio Code as it almost certainly has the best TS support of any free editor. Of course, it’s also an excellent editor for many other reasons, and managed to lure me away from Sublime Text, my old friend of many years.
If you don’t want to use TypeScript, you will definitely want Babel (with the JSX transform) as React is geared toward the newer ES6+ syntax. And you’ll probably want webpack for preparing bundled code as the React community has more or less chosen webpack as their “official bundler”; while it’s still not necessarily easy to configure, newer versions have come a long way in simplifying that process. If you’re in a hurry, Create React App is a fast and easy way to create a React app with both of these tools pre-configured and ready to go.