Installing React

To start using the React library, we need to first install it.

At the time of writing, the latest version of React library is 16.0.0. Over time, React gets updated, so make sure that you use the latest version that is available to you, unless it introduces breaking changes that are incompatible with the code samples provided in this book. Visit https://github.com/PacktPublishing/React-Essentials-Second-Edition to learn about any compatibility issues between the code samples and the latest version of React.

In Chapter 2, Installing Powerful Tools for Your Project, I introduced you to Webpack, which allows us to import all the dependency modules for our application using the import function. We'll be using import to import the React library as well, which means that instead of adding a <script> tag to our index.html file, we'll be using the npm install command to install React:

1. Navigate to the ~/snapterest/ directory and run this command:

   npm install --save react react-dom
   

2. Then, open the ~/snapterest/source/app.js file in your text editor, and import the React and ReactDOM libraries to the React and ReactDOM variables, respectively:

   import React from 'react';
   import ReactDOM from 'react-dom';

The react package contains methods that are concerned with the key idea behind React, that is, describing what you want to render in a declarative way. On the other hand, the react-dom package offers methods that are responsible for rendering to the DOM. You can read more about why developers at Facebook think it's a good idea to separate the React library into two packages at https://facebook.github.io/react/blog/2015/07/03/react-v0.14-beta-1.html#two-packages.

Now we're ready to start using the React library in our project. Next, let's create our first React element!