title: Using react routes for routing in a react application
body: <p>I am trying to setup the routes for a simple react application and react-router doesn't seem to match the given routes in the switch defaults the 404 page </p>
  
  <p>Here is the code for the routes: </p>
  
  <pre><code>import {
    BrowserRouter as Router,
    Route,
    Switch,
    HashRouter
  } from "react-router-dom";
  
  window.React = React;
  
  render(
    &lt;Router&gt;
      &lt;Switch&gt;
        &lt;HashRouter&gt;
          &lt;Route exact path="/" component={App} /&gt;
  
          &lt;Route path="list-days" component={App} /&gt;
  
          &lt;Route path="add-day" component={AddDayForm} /&gt;
          &lt;Route component={Whoops404} /&gt;
        &lt;/HashRouter&gt;
      &lt;/Switch&gt;
    &lt;/Router&gt;,
    document.getElementById("root")
  );
  </code></pre>
  
  <p>And here is the code for the links to those routes: </p>
  
  <pre><code>import { Link } from "react-router-dom";
  import { IoIosHome as Home } from "react-icons/io";
  import { FaCalendarPlus } from "react-icons/fa";
  import { FaTable } from "react-icons/fa";
  
  export const Menu = () =&gt; (
    &lt;nav className="Menu"&gt;
      &lt;Link to="/" activeclassname="selected"&gt;
        &lt;Home /&gt;
      &lt;/Link&gt;
      &lt;Link to="/add-day" activeclassname="selected"&gt;
        &lt;FaCalendarPlus /&gt;
      &lt;/Link&gt;
      &lt;Link to="/list-days" activeclassname="selected"&gt;
        &lt;FaTable /&gt;
      &lt;/Link&gt;
    &lt;/nav&gt;
  </code></pre>
  
  <p>When you click anything but the home link the 404 page is displayed. </p>