React routing help routing not actually jumping to the page
<p>So I am very new to React and react routing so forgive me if this is simple. I have seen similar questions asked but not quite what I was looking for or I didnt understand it enough to figure it out.</p>

<p><b>Question:</b> How do I get routing to jump to the page? It changes in the URL but seemingly no change. (localhost:8080/#/listings?_k=26kljm) is the same as localhost:8080/</p>

<p>Anyway here is what I have</p>

<h2>main.js</h2>

<pre><code>import React from "react";
import ReactDOM from "react-dom";
import { Router, Route, IndexRoute, hashHistory } from "react-router";

import Layout from "./components/Layout";
import Listing from "./components/pages/Listings";
import NoMatch from "./components/partials/NoMatch";

const app = document.getElementById('app');

ReactDOM.render(
&lt;Router history={hashHistory}&gt;
  &lt;Route path="/" component={Layout}&gt;
    &lt;Route path="/listings" name="listings" component={Listing}&gt;&lt;/Route&gt;
   &lt;/Route&gt;
 &lt;/Router&gt;,
app);
</code></pre>

<h2>Layout.js</h2>

<pre><code>import React from "react";

import Footer from "./partials/Footer";
import Body from "./pages/Index";
import Header from "./partials/Header";

export default class Layout extends React.Component {

 render() {
   return (
     &lt;div&gt;
       &lt;Header/&gt;
       &lt;Body /&gt;
       &lt;Footer /&gt;
     &lt;/div&gt;
   );
  }
}
</code></pre>

<h2>Header.js</h2>

<p>This one is long so ill spare you but you should know there is a link</p>

<pre><code>&lt;Link to="/listings"&gt;Listings&lt;/Link&gt;
</code></pre>

<p>And finally </p>

<h2>Listings.js</h2>

<pre><code>import React from "react";

import Header from "../partials/Header";
import Footer from "../partials/Footer";

export default class Listings extends React.Component {
  render(){
    return(
        &lt;div&gt;
            &lt;Header /&gt;
            &lt;div class="row"&gt;
                &lt;div class="col-md-8"&gt;
                    &lt;h1&gt;THIS SHOULD BE HERE&lt;/h1&gt;
                &lt;/div&gt;
            &lt;/div&gt;
            &lt;Footer /&gt;
        &lt;/div&gt;
      );
   }
 }
</code></pre>

<p>I feel like I am missing something small or I dont have a good grasp on components.</p>

<p>To Note: I just noticed in the source the <code>Link</code> created an href like this
    Listings</p>

<p>Why is the extra hash there!?
I get a <code>Cannot GET /listings</code> if I go directly to <code>localhost:8080/listings</code></p>