Let's create a React application and then add React-Router as a dependency.
The first step is to install create-react-app globally using NPM, as follows:
npm install -g create-react-app
The CLI requires the node version to be greater than or equal to 6, and the npm version to be greater than 5.2.0.
Once the CLI has been installed, we will create a new application using the create-react-app command, as seen here:
The following output is displayed when create-react-app completes the installation of packages:
Inside that directory, you can run several commands:
Starts the development server.
npm run build
Bundles the app into static files for production.
Starts the test runner.
npm run eject
Removes this tool and copies build dependencies, configuration
and scripts into the app directory. If you do this, you can't
We suggest that you begin by typing:
If you used the yarn package manager (https://yarnpkg.com/en/), the npm commands in the preceding snippet would be replaced with yarn.
The react-router-demo-app directory is created during installation (if it doesn't already exist). Inside the directory, the following project structure is created:
On running npm start, the application is compiled and will open a browser window with a Welcome to React message displayed, as shown here:
In the index.js file, the ReactDOM reference is used to render the application's root component as follows:
ReactDOM.render(<App />, document.getElementById('root'));
The <App> component marks the beginning of the tree that will get rendered when the application starts.