Tutorial – Say hello to React.js
we will learn how to setup React and write your first “Hello world” application.
First things first: you need to get a copy of the React library. Luckily this is as simple as it can be. Go tohttp://reactjs.com (which should redirect you to the official GitHub home at http://facebook.github.io/react/), then click the “Download” button, then “Download Starter Kit” and you’ll get a copy of a zip file. Unzip and copy the directory contained in the download to a location where you’ll be able to find it.
mkdir ~/reactbook mv ~/Downloads/react-0.13.3/ ~/reactbook/react
The only file you need to get started for the time being is
~/reactbook/react/build/react.js. You’ll learn about all the others as you go along.
At the time of writing 0.13.3 is the latest stable version.
Note that React doesn’t impose any directory structure, you’re free to move to a different directory or rename
react.js however you see fit.
Hello React world
Let’s start with a simple page in your working directory (
<!-- my app renders here -->
// my app's code
There are only two notable things happening in this file:
- you include the React library (
- you define where your application should be placed on the page (
Now let’s add the code that says hello. Update
hello.html and replace
// my app's code with:
hello.html in your browser and you’ll see your new app in action
Congratulations, you’ve just built your first React application!