What is React?

React is an open-source frontend JavaScript library which is used for building user interfaces especially for single page applications. It was created by Jordan Walke, a software engineer working for Facebook. React was first deployed on Facebook's News Feed in 2011 and on Instagram in 2012.

React can be used to develop single page and mobile applications. Its goal is to provide high speed, simplicity and scalability. As a library for developing user interfaces, React is often used with other libraries such as Redux.

Features

One-way Data Binding

Properties are passed from parent to child components. Components receive properties as a set of immutable values, so the component cannot change properties directly, but can invoke changes via function callbacks. This mechanism is called "properties down, events up".

Virtual DOM

React uses a Virtual DOM. React creates an in-memory cache structure that allows it to calculate the difference between the previous and current state of the interface to optimally update the browser DOM. Thus, the programmer can work with the page, assuming that it is updated entirely, but the library decides on its own which components of the page need to be updated.

JSX

JavaScript XML (JSX) is a JavaScript syntax extension that allows you to use an HTML-like syntax to describe the structure of an interface. Basically, components should be written using JSX, but it is also possible to use plain JavaScript. JSX resembles another language created by Facebook for the PHP extension, XHP.

Lifecycle Methods

Lifecycle methods allow a developer to run code at different stages of a component's lifecycle. For example:

• shouldComponentUpdate Allows you to prevent the component from rerendering by returning false if rerendering is not needed.
• componentDidMount - called after the first rendering of the component. It is often used to trigger getting data from a remote source via an API.
• render is the most important lifecycle method in class components. It represented the template in JSX that will be rendered.

More than rendering HTML in the browser

React is used for more than just rendering HTML in the browser. For example, Facebook has dynamic charts that are rendered in <canvas> tags. With React and React Native we can develop mobile application.