react intro jsx

gistfile1.txt

var Hello = React.createClass({
	getInitialState: function() {
  	return {
    	message: "hi hi hi",
      color: "red"
    }
  },
	
  updateMessage: function(event) {
		var newValue = event.target.value;
    var updateHash = { message: newValue };
    
    if (event.target.value.length > 5) {
    	updateHash.color = "blue";
    } else {
      updateHash.color = "red";
    }
    this.setState(updateHash);
  },

  render: function() {
    return (
    	<div>
      	<h1>Hi ya'll</h1>
        <input onInput={this.updateMessage} placeholder="Add a message!" />
        <div style={{color: this.state.color, marginTop: "20px"}}>{this.state.message}</div>
      </div>
     );
  }
});

ReactDOM.render(
  <Hello name="World" />,
  document.getElementById('container')
);