index.js

import React from 'react';
import ReactDOM from 'react-dom';
import App from './components/App.jsx';
import bulma from 'bulma';

// using an ES6 transpiler, like babel
import { Router, Route, browserHistory } from 'react-router';


const Home = React.createClass({
    render: function() {
        return (
            <div className="container">

            <div className="notification">
                <App />

                </div>
            </div>
        );
    }
});


const MainLayout = React.createClass({
    render: function() {
        // Note the `className` rather than `class`
        // `class` is a reserved word in JavaScript, so JSX uses `className`
        // Ultimately, it will render with a `class` in the DOM
        return (
            <div className="app">
                <header className="primary-header"></header>
                <aside className="primary-aside"></aside>
                <main>
                    {this.props.children}
                </main>
            </div>
        );
    }
});

const SearchLayout = React.createClass({
    render: function() {
        return (
            <div className="search">
                <header className="search-header"></header>
                <div className="results">
                    {this.props.children}
                </div>
                <div className="search-footer pagination"></div>
            </div>
        );
    }
});

const UserList = React.createClass({
    render: function() {
        return (<div>
                <App />
            <ul className="user-list">
                <li>Dan</li>
                <li>Ryan</li>
                <li>Michael</li>
            </ul>
            </div>
        );
    }
});
ReactDOM.render((
    <Router history={browserHistory}>
        <Route path="/" component={Home} />
        <Route component={MainLayout}>
            <Route component={SearchLayout}>
                <Route path="users" component={UserList} />
            </Route>
        </Route>
    </Router>
), document.getElementById('root'));