<main></main>

var Display = React.createClass({
  propTypes: {
    number: React.PropTypes.number
  },
  render: function() {
    return <p className="display">{this.props.number}</p>
  }
});

var Counter = React.createClass({
  getInitialState: function() {
    return { clicks: 0 };
  },
  onClick: function(e) {
    this.setState({ clicks: this.state.clicks + 1 });    
  },
  render: function() {
    return (<div className="counter">
        <button onClick={this.onClick}>Click Here</button>
        <Display number={this.state.clicks} />
        <Display number={this.state.clicks} />
        <Display number={this.state.clicks} />
      </div>);
  }
});

var App = React.createClass({
  render: function render() {
    return (
      <div>
        <Counter />
        <Counter />
      </div>
    );
  }
});

ReactDOM.render(<App name="ynon" />, document.querySelector('main'));