Creating a container React component

Let's start by editing our application's main JavaScript file. Replace the contents of the ~/snapterest/source/app.js file with the following code snippet:

var React = require('react');
var ReactDOM = require('react-dom');
var Application = require('./components/Application.react');

ReactDOM.render(<Application />, document.getElementById('react-application'));

There are only four lines of code in this file, and as you can guess, they provide document.getElementById('react-application') as a deployment target for the <Application /> component and render <Application /> to the DOM. The whole user interface for our web application will be encapsulated in one React component, Application.

Next, navigate to ~/snapterest/source/components/ and create the Application.react.js file inside this directory. All of our React components will have their filenames ending with react.js. This convention allows us to easily distinguish between React and...