Simple Aviator/React example. Read more about Aviator here: https://github.com/swipely/aviator

app_route_target.js

/** @jsx React.DOM */

var AppRouteTarget = {
  setupLayout: function () {
    React.renderComponent({
      <App className='page-content'>,
      document.querySelector('body')
    });
  }
};

routes.js

// define routes
Aviator.setRoutes({
  target: AppRouteTarget,
  // setupLayout is run for every route in the route tree.
  '/*': 'setupLayout'
  '/users': {
    target: UsersRouteTarget,
    '/': 'list'
    '/:id': 'show'
  }
});

// Start routing
Aviator.dispatch();

users_route_target.js

/** @jsx React.DOM */

var UsersRouteTarget = {
  list: function () {
    // placeholder - use favorite ajax lib here
    var users = [];
    
    React.renderComponent({
      <UserList users={users}/>,
      document.querySelector('.page-content')
    });
  },
  
  show: function (request) {
    // placeholder - use favorite ajax lib here
    var user = { id: request.params.id };
    
    React.renderComponent({
      <User user={user}/>,
      document.querySelector('.page-content')
    });
  }
};