3.1.1. Characteristics of React ¶

• 1.Declarative design −React by using the declaration paradigm, the application can be easily described.

• 2.Efficient −React through the simulation of DOM, the interaction with DOM is minimized.

• 3.flexible −React works well with known libraries or frameworks.

• 4.JSX − JSX is an extension of JavaScript syntax. React developers don’t necessarily use JSX, but we recommend it.

• 5.Component − passes through React building components makes the code easier to reuse and can be well applied in the development of large projects.

• 6.Data flow − of one-way response React the data flow of one-way response is implemented, thus reducing repetitive code, which is why it is simpler than traditional data binding.

3.1.2. What you need to know before reading this tutorial: ¶

At the beginning of learning React before, you need to have the following basic knowledge:

• HTML tutorial

• CSS tutorial

• JavaScript tutorial

• ES6 tutorial

3.1.3. The first instance of React ¶

In each chapter, you can edit the instance online and click the button to view the results.

This tutorial uses the React version 16.4.0, you can download the latest version at https://reactjs.org/ .

<divid="example"></div><scripttype="text/babel">ReactDOM.render(<h1>Hello,
world!</h1>, document.getElementById('example') );</script>

import React from "react";
import ReactDOM from "react-dom";
function Hello(props) {
  return <h1>Hello World!</h1>;
}
ReactDOM.render(<Hello />, document.getElementById("root"));

Hello World!