ReactJS: JavaScript just like you've always done it.

gistfile1.js

/**
 * ReactJS: JavaScript like you've always done it.
 * 
 * This example renders your top ten most followed friends/followers, `filter`ing
 * only your favorites, and putting a star on all verified accounts.
 * 
 * With ReactJS, any time your data changes, the UI is always brought up to date
 * automatically. If friends length changes, or followCount - it always shows what
 * `render` describes.
 */

var PeopleList = React.createClass({
  render: function() {
    var friends = this.props.friends;
    var followers = this.props.followers;
    return div({className: 'list'},
      friends.concat(followers)
        .filter(function(person) {return person.isFavorite;})
        .sort(function(one, two) {return one.followCount - two.followCount;})
        .slice(0, 10)
        .map(function(person) {
          return div({className: person.isVerified ? 'star' : 'gray'}, person.name);
        })
    );
  }
});

/**
 * Instead of making you set up "Bindings" to models:
 *   - React uses plain JavaScript *functions* to bind outputs to inputs.
 *
 * Instead of making you set up "computed values":
 *   - React uses plain JavaScript *expressions* to compute values.
 *
 * Instead of making you use "collections":
 *   - React uses plain JavaSctript *Arrays* to model changing lists.
 *
 * - Just functions.
 * - Just expressions.
 * - Just plain Arrays and Objects.
 * - React JavaScript: Just like you've always done it.
 */
 
 // Fork at: https://github.com/facebook/react