Here is also a good tutorial on learning html basic page layout in 5 minutes.
II. Run a Hello World React!<!DOCTYPE html>
<meta charset="UTF-8" />
You can copy it to a file and name it myFirstReact.html and run it. It displays "Hello, world!". You will notice ReactDOM.reander(). The " inside the script section is called JSX. You don't have to use JSX with React, but it is good to use it and it is simple.
III. Download the Starter KitGet the development starter kit with a set of examples from React's GitHub site.
Then you can browse the examples and run them.
This is the very best way to learn.
Or learn React through React JSFiddle.
IV. Install npm and react
It is recommended to use React with npm with bundler like browserify or webpack. The following shows installing npm and react and build a bundle with browserify.
1. Install npmNPM comes with nodejs. Here is the download page.
2. Install Browserify
npm install -g browserify
If you encounter any issues, go to this link to check npm documentations.
The above command will install browserify to npm's default directory, which is normally the user local folder.
To find out where is this directory, use the following command.
npm config get prefix
3. Install React
Go to npm's default directory through a command prompt. Then use the following to install React, React DOM.
npm istall --save react react-dom babelify babel-preset-react
4. Bundle with BrowserifyThen create a main.js file to build bundle with browserify. Put the following into the main.js to use react and react-dom npm packages. Save the main.js in the npm default directory/node_modules.
Then run the following with the command prompt.
browserify -t babelify --presets react main.js -o bundle.js
5. Install babel for transform of JSX code to js.
npm install --global babel-cli
npm install babel-preset-react