TodoApp react component to demonstrate react lifecycle. sample from : http://modernweb.com/2014/07/23/getting-started-reactjs/

TodoApp.js

/** @jsx React.DOM */
var React = require('react'),
    TodoList = require('./todo-list');

var TodoApp = React.createClass({
  getInitialState: function(){
    console.log('TodoApp -- getInitialState');
    return {
      items: [],
      text: ''
    };
  },

  render: function(){
    console.log('TodoApp -- render');
    return (
      <div>
        <h3>TODO</h3>
        <TodoList items={this.state.items} />
        <form onSubmit={this._handleSubmit}>
          <input onChange={this._onChange} value={this.state.text} />
          <button>{'Add #' + (this.state.items.length+1)}</button>
        </form>
      </div>
    );
  },

  _onChange: function(e){
    this.setState({text: e.target.value});
  },

  _handleSubmit: function(e){
    e.preventDefault();
    var nextItems = this.state.items.concat(this.state.text);
    var nextText = '';

    this.setState({
      items: nextItems,
      text: nextText
    });
  }

});


React.renderComponent(
  <TodoApp />,
  document.getElementById('app'));