React.js Overview

DZone 's Guide to

React.js Overview

Interested in getting started with React.js? Read on to get a high-level overview of the framework and see if it's the one for you.

· Web Dev Zone ·
Free Resource

React is a JS framework originally developed by engineers at Facebook. There are many different opinions on the usefulness and advantages of this product. Let’s take a look at the pros and cons.

React Features

Comparing React.js with Angular or other MVC frameworks makes no sense since React is just a representation. React is a template-based language combined with several functions that support output to HTML, i.e. the result of React’s operation is HTML code.

React.js implements the concept of reactive programming: modification of the result of its work depends on the state of components. Thus, a = b + c, and A will always depend on the values of B an C.

React constantly works with the DOM, re-rendering it when conditions change (the part of the DOM that is changed by React.js is called a component). Prior to React, such a practice would have seriously affected the application’s performance, but the developers of React.js approached this problem quite radically: they completely rewrote the DOM in JavaScript.

An important feature of React.js is the use of JSX. This is a JS add-on supporting the use of pro-XML syntax in JavaScript code. JSX is a blend of JavaScript and HTML that is quite unusual for most developers. The standard practice is to separate the JS part and the markup, which makes it difficult to track HTML -> JS -> HTML changes. JSX helps you see all processes in a single place without getting distracted by the complexities of well-written and valid code. JSX compiles into pure JS.


The kind of difficulties React.js novices may face include:

  • Complex documentation
  • On the developer’s website, the tutorial is scattered across multiple tabs and the information is far from being structured. However, if there is a whole team working with React.js, this problem can be solved pretty quickly. We recommend studying the documentation at devdocs.io, where this information is presented in a more structured way.

  • Not all standard browsers support React
  • To solve this problem, it is recommended that you use additional plug-ins – for example, the S5-shim library for IE8 support. There exist other extensions for React.js, however, considering the “weight” of the framework, their use should be minimized.

  • Few gadgets available
  • React.js is a relatively young framework, so all, even standard, widgets will have to be written nearly from scratch. Need a custom drop-down or lightbox? You’ll have to write a fair deal of code even for such simple tasks.


UI development is based on separate components – and that’s the future of development.

React works great for teams, it’s a pleasure to write in, and easy to test.

dom, javascript, jsx, react.js, web dev

Published at DZone with permission of Alex Azarov . See the original article here.

Opinions expressed by DZone contributors are their own.

{{ parent.title || parent.header.title}}

{{ parent.tldr }}

{{ parent.urlSource.name }}