React Base Fiddle (JSX)

Starting point for creating JSFiddles with React. This uses React with Addons.

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/babel-core/5.8.24/browser.js"></script>
<script src="https://fb.me/react-with-addons-15.1.0.js"></script>
<script src="https://fb.me/react-dom-15.1.0.js"></script>
<script src="https://facebook.github.io/react/js/jsfiddle-integration-babel.js"></script>

<div id="root">
  <!-- This element's contents will be replaced with your component. -->
</div>

CSS

.messages {
  height: 50px;
  border: 1px solid black;
  overflow: auto;
}

.chat-row {
  border-top: 1px solid black;
  padding: 5px;
}

.chat-row:first-child {
  border-top: none;
}

JavaScript 1.7

class Messages extends React.Component {  
  onRowRender(row) {
    var rowDOM = ReactDOM.findDOMNode(row);
    var offsets = rowDOM.getClientRects()[0];
    var parent = rowDOM.parentNode;
    parent.scrollTop = offsets.top;
  }

  render() {
    return (
      <div className='messages'>
        {this.props.datas.map((data, i) => {
					return (
				    <Row
	 	  			  key={data.key}
					    username={data.username}
					    message={data.message}
					    onRender={i === this.props.datas.length - 1 ? this.onRowRender : null}
				    />
			    );
		    })}
      </div>
    );
  }
}

class Row extends React.Component {
  componentDidMount() {
    if (this.props.onRender) this.props.onRender(this);
  }

	render() {
		return (
			<div className='chat-row'>
				{this.props.message}&nbsp;&nbsp;&nbsp;by: {this.props.username}
			</div>
		);
  }
}

var datas = [
  {
    key: 1,
    username: 'test user #1',
    message: 'test message #1',
  }, {
    key: 2,
    username: 'test user #2',
    message: 'test message #2',
  }, {
    key: 3,
    username: 'test user #3',
    message: 'test message #3',
  }, {
    key: 4,
    username: 'test user #4',
    message: 'test message #4',
  }, {
    key: 5,
    username: 'test user #5',
    message: 'test message #5',
  },
];

ReactDOM.render(
  <Messages datas={datas}/>,
  document.getElementById('root')
);