gistfile1.js

/** @jsx React.DOM */
var MyRootComponent = React.createClass({
  getInitialState: function() {
    return {perMinute: '-', perDay: '-'};
  },
  componentDidMount: function() {
    var socket = io.connect(this.props.url);
    socket.on('business.clickout', this.setState.bind(this));
  },
  render: function() {
    return <MyComponent perMinute={this.state.perMinute} perDay={this.state.perDay} />;
  }
});

var MyComponent = React.createClass({
  render: function() {
    var perMinute = this.props.perMinute;
    var perDay = this.props.perDay;
    return (
      <div>
        <h3>Clickouts</h3>
        <p>last Minute: {perMinute}</p>
        <p>today: {perDay}</p>
      </div>
    );
  }
});
 
 
React.renderComponent(
  <MyRootComponent url="http://localhost:3000" />,
  document.getElementById('domid')
);

This is the sort of thing I am trying to do myself, I figured I should connect on my root component, but how would you pass the socket down to children components so that they may listen on specific channels?