Halp!

AppHandler.js

/** @jsx React.DOM **/
var React = require('react');

module.exports = React.createClass({

  propTypes: {
    navigationStore: React.PropTypes.shape({
      fetch: React.PropTypes.func,
      all: React.PropTypes.func
    })
  },

  getInitialState() {
    return {
      pages: this.props.navigationStore.all()
    };
  },

  componentWillMount() {
    this.props.navigationStore.fetch();
    this.props.navigationStore.addChangeListener(this.handleNavigationStoreChange);
  },

  componentWillUnmount() {
    this.props.navigationStore.removeChangeListener(this.handleNavigationStoreChange);
  },

  handleNavigationStoreChange() {
    this.setState({
      pages: this.props.navigationStore.all()
    });
  },

  render() {
    var pages = this.state.pages.map((page) => {
      return ( 
        <li key={page.id}>{page.title}</li>
      );
    });

    return (
      <div>
        <h1>Hello World!</h1>
        <ul>
          {pages}
        </ul>
        {this.props.activeRouteHandler}
      </div>
    );
  }
});

HomeHandler.js

/** @jsx React.DOM **/
var React = require('react');

module.exports = React.createClass({

  render() {
    return (
      <h1>Cards</h1>
    );
  }

});

Router.js

/** @jsx React.DOM */

var Router = require('react-router');
var Routes = Router.Routes;
var Route = Router.Route;
var DefaultRoute = Router.DefaultRoute;
var NavigationStore = require('./AppHandler/stores/NavigationStore');
var AppHandler = require('./AppHandler');
var HomeHandler = require('./HomeHandler');

module.exports = (
  <Routes location='history'>
    <Route name='App' path='/' handler={AppHandler} navigationStore={new NavigationStore()}>
      <DefaultRoute handler={HomeHandler} />
    </Route>
  </Routes>
);