title: Access to router directly by typing it's address on the address bar in react-router
body: <p>There is two &quot;main&quot; way to use react-router (V4); The first way is using hash router which you can access directly to an address by typing it on browser's address bar but you must add a # to URL, another way is using BrowserRouter which has a pretty and user-friendly URL structure but you can't directly type the address to render the route.</p>
  <p>How I can config HashRouter to work without # or config BrowserRouter to work with directly URL typing, too? Is it possible with .htaccess? How?</p>
  <hr />
  <pre><code>const React = require('react');
  const ReactDOM = require('react-dom');
  import { HashRouter as Router, Route, Link} from 'react-router-dom';
      
  const routes = (
      &lt;Router forceRefresh={false}&gt;
          &lt;div&gt;
              &lt;Route exact path=&quot;/&quot; component={Firstpage}/&gt;
              &lt;Route exact path=&quot;/projects&quot; component={Projectslist}/&gt;
          &lt;/div&gt;
      &lt;/Router&gt;
  );
  
  ReactDOM.render(routes, document.getElementById('app'));
  </code></pre>
  <p>[In this type it works with a # mark. e.g.: localhost:2000/#/projects ]</p>
  <hr />
  <p>Another type:</p>
  <pre><code>const React = require('react');
  const ReactDOM = require('react-dom');
  import { BrowserRouter as Router, Route, Link} from 'react-router-dom';
      
  const routes = (
      &lt;Router forceRefresh={true}&gt;
          &lt;div&gt;
              &lt;Route exact path=&quot;/&quot; component={Firstpage}/&gt;
              &lt;Route exact path=&quot;/projects&quot; component={Projectslist}/&gt;
          &lt;/div&gt;
      &lt;/Router&gt;
  );
      
  ReactDOM.render(routes, document.getElementById('app'));
  </code></pre>
  <p>[And in this type it works well without a # mark, but it's not possible to load it directly on the browser's address bar.]</p>