title: How to setup React Router in a sub folder with an ambiguous path
body: <p>I'm new to react router and was wondering if anyone has any idea on how to set it up in the following situation.</p>
  
  <p>Say we have a php application running on <code>'http://www.example.com'</code>. On a specific route we have a react application running e.g <code>'http://www.example.com/misc/stats/'</code> This app has two routes <code>'/'</code> and an ambiguous one <code>'/:user'</code>. </p>
  
  <p>I'm using react router 4. How do I serve the app from that folder and have routes be relative to that url. At the moment I've tried setting the <code>basename</code> like so.</p>
  
  <pre><code>ReactDOM.render(
    &lt;Provider store={store}&gt;
      &lt;Router basename={basePath} history={history}&gt;
        &lt;App /&gt;
      &lt;/Router&gt;
    &lt;/Provider&gt;,
    root,
  );
  </code></pre>
  
  <p>Then in <code>&lt;App /&gt;</code> I have a simple setup.</p>
  
  <pre><code>const Test1 = () =&gt; (&lt;div&gt;Test1&lt;/div&gt;);
  const Test2 = () =&gt; (&lt;div&gt;Test2&lt;/div&gt;);
  
  class App extends Component {
    render() {
      return (
        &lt;div&gt;
          &lt;Link to="/"&gt;A&lt;/Link&gt; | &lt;Link to="/b"&gt;B&lt;/Link&gt;
          &lt;Switch&gt;
            &lt;Route path="/a" component={Test1} /&gt;
            &lt;Route path="/b" component={Test2} /&gt;
          &lt;/Switch&gt;
        &lt;/div&gt;
      );
    }
  }
  </code></pre>
  
  <p>But this doesn't work. Any thoughts? Futhermore, my biggest concern is how to handle direct url's to <em>users</em> For example to <code>'http://www.example.com/misc/stats/johndoe'</code> There is of course no johndoe folder, the app is served from the <code>'stats'</code> folder. I believe I would need to send all requests to <code>/misc/stats/(*)</code> to <code>/misc/stats/index.html</code> but i'm not quite sure.</p>