Why doesn't react router redirect from the address bar, but only from a link in the layout?

Question

JavaScript

A little pain at the beginning : I'm just learning react and I'm already exhausted after every slightest change, then the new version and everything old is not supported and in general you need to download react-router-dom, then the webpack will fall off, or something else. The slightest change and you have to google what the plug is, and in the lessons they don’t talk about the version, which is terribly wrong due to the total changes that occur almost daily. I’m already silent that from lesson to lesson my own style, wrapper and assembly is used, under which it is unrealistic to rebuild every time.
To the point : I have the last node, npm, react and router. I'm doing a lesson from scotch tape: https://scotch.io/tutorials/routing-react-apps-the...
serve works, everything starts in the usual way, Watch catches changes.
I added different fish content components:

class Car extends Component {
  render(){
    return (<h1>Cars page</h1>);
  }
}

Next, in the render, I write a router, please note that there is no longer a lesson here, because not relevant, but with what I googled:

<Router>
    <div>
      <ul>
        <li><Link to="/">Home</Link></li>
        <li><Link to="/about">About</Link></li>
        <li><Link to="/car">Car</Link></li>
      </ul>
      <Route exact path="/" component={Home}/>
      <Route path="/about" component={About}/>
      <Route path="/car" component={Car}/>
    </div>
  </Router>

What's the point: everything works fine if you follow these links, however, if you just enter the address in the address bar, you will get a sad Not found. I have already googled a lot trying to at least just make the hello world work from the lesson, but Google and the mind are no longer enough for this, in the issuance, basically, how to make a 404 page.

Answer 1

In the webpack config add:

devServer: {
    historyApiFallback: true
  },

And in output:
publicPath: '/'