Flux over the Wire client.jsx

client.jsx

const client = new FluxClient('http://localhost:8080');
const messageList = client.Store('/messageList');
const postMessage = client.Action('/postMessage');
const MessageList = React.createClass({
  getInitialState() {
    return { messageList: this.props.messageList.head, message: null };
  },

  componentDidMount() {
    messageList.onUpdate(({ head }) => this.setState({ messageList: head }));
  },

  submitMessage() {
    this.props.postMessage.dispatch({ message: this.state.message });
  },

  render() {
    return <div>
      <ul>Messages
        {messageList.map(({ message }, key) => 
          <li ...{key}><Message ...{ message } /></li>
        )}
      </ul>
      <input value={this.state.message} 
        onChange={({ target }) => this.setState({ message: target.value })} />
      <button onClick={this.submitMessage} />
    </div>;
  }
});

React.render(<MessageList ...{ messageList, postMessage } >);