gistfile1.txt

//Sidebar.js

var React = require('react');
var ReactRouter = require('react-router-dom');
var NavLink = ReactRouter.NavLink;


class SideBar extends React.Component {
    render () {
        return (
            <aside className="sidebar-left">
                    <a className="company-logo" href="#">Logo</a>
                    <div className="sidebar-links">
                        <NavLink className="link-blue" to="/"><i className="fa fa-picture-o"></i>Home</NavLink>
                        <NavLink className="link-red" to="/"><i className="fa fa-heart-o"></i>Favorites</NavLink>
                        <NavLink className="link-yellow selected" to="/"><i className="fa fa-keyboard-o"></i>Projects</NavLink>
                        <NavLink className="link-green" to="/"><i className="fa fa-map-marker"></i>Places</NavLink>
                    </div>

            </aside>
        )
    }
}

module.exports = SideBar;


// LAYOUT.JS

var React = require('react');
var SideBar = require('../component/SideBar');

class Layout extends React.Component {

    render () {
       return (
           <div className="container">
                <SideBar/>
                {this.props.children}
            </div>
       );
    }

}

module.exports = Layout;

//APP.JS

var React = require('react');
var ReactRouter = require('react-router-dom');
var Layout = require('../pages/Layout');
var Index = require('../pages/Index');
var Router = ReactRouter.BrowserRouter;
var Route = ReactRouter.Route;
var IndexRoute = ReactRouter.IndexRoute;
var History = ReactRouter.hashHistory;


class App extends React.Component {

    render () {
        return (
            <Router history={History}>
                <Route path="/" component={Layout}>
                    <IndexRoute component={Index}  />
                </Route>
            </Router>
        );
    };
}

module.exports = App;