React HashRouter

Example code snippet on HashRouter from react-router-dom.  This routing alternative can be used on hosting services such as GitHub pages and other static hosting services.

Implementation

Import HashRouter:

import { HashRouter as Router, Route } from 'react-router-dom';

Example code that goes in render():

<HashRouter>

   <div>

      <Route path="/" component={Home} />

      <Route path="about" component={About} />

      <Route path="teachers" component={Teachers} />

      <Route path="courses" component={Courses} />

   </div>

</HashRouter>

Here’s a link to my Gist if that doesn’t come out correctly.

Drawbacks

A collection of thoughts and issues I’ve found for using HashTag for a website:

• There could be SEO issues related to using the HashTag URLS.
• Clean URLs are better for SEO.  However, that’s also still questionable since this is a Single Page Application (SPA) unless generated from a NodeJS backend that can help generate the appropriate content.