Progressive Web Apps with React

Our BrowserRouter

The first thing we need to do is wrap our entire application in the BrowserRouter component, then we can add our Route components.

Since we want to have our router around our entire application, the easiest place to add it is in our src/index.js. At the top, we require the following component:

import React from 'react';import ReactDOM from 'react-dom';import { BrowserRouter } from 'react-router-dom';import App from './components/App';

Then, we render our App as a child of BrowserRouter:

ReactDOM.render(  <BrowserRouter>    <App />  </BrowserRouter>,  document.getElementById('root'));

You should also do the same inside our hot re-loader configuration:

if (module.hot) {  module.hot.accept('./components/App', () => { const NextApp ...