React was introduced to the world three years ago, and since then it has seen impres-sive growth, both inside and outside Facebook. New web projects at Facebook are commonly built using React in one form or another, and it is being broadly adopted across the industry.Developers and engineers are choosing React because it al-lows spending more time to focus more on the product development and less time spent on fighting and learning to the framework.
A React application is a collection of discrete components, each representing a single view. The idea of every individual view component makes it easy to iterate on product development because to make changes on a single view or component, it is not neces-sary to consider the entire system. When an application is built with React, the code is generally predictable, it is because React wraps the DOM mutative, imperative API with a declarative one, which raises the level of abstraction and simplifies the programming model. Moreover, it is easier to scale the application built with React.
The combination of React and the rapid iteration cycle of the web, has enabled to make some excellent products including many Facebook components. An amazing JavaS-cript framework called Relay has also been made on top of React, which helps simplify-ing data fetching on a large scale.
Short and Easy Learning Curve
In Ionic, it requires to use the directive called ngRepeat. Let’s assume an array of em-ployers. Each of them contains the following fields: first_name, last_name, is_married.
The target is to show only employers who are married. The following Figure 1 shows a screenshot of a function written in Ionic framework.
As shown in Figure 1, a function is written called EmployerCtrl where it shows some specific information of the employers.
Figure 2 shows a screenshot of a directive called ngRepeat written in AngularJS framework.
As shown in Figure 2, this is how a directive is written in AngularJS framework.
If one is not familiar with Ionic/Angular, this code snippet may raise some immediate questions of what is the $scope and what is the specific syntax here for the filter.
But in React, one can use the existing knowledge of language fundamentals. The above functionality can be done using filter and map functions in React. The following Figure 3 shows how to write the function in ReactJS.
Figure 3 Screenshot of how to use filter and map function in ReactJS.
React is Fast and Agile
ReactJS is featured with one-way unidirectional data flow between the states and lay-ers in an application. This means data flows in single direction between the application states and layers. In two-way data binding like Angular, if a model is changed, the view also changes and vice-versa. React renders the updates in the DOM much quicker than alternative frameworks and it is a much smaller library. DOM means document object model. Thus, it is easy to choose the tools to get the job done.
React Introduced JSX
Big Development Community
Big companies like New York Times, Airbnb, Facebook, and Netflix are using React in production. They are continuously contributing to develop the React core and building amazing third party libraries that work great with any React applications.