React Base Fiddle (JSX)

React JS with JSX

by lshettyl

HTML

<script src="https://fb.me/react-with-addons-0.14.0.js"></script>
<script src="https://fb.me/react-dom-0.14.0.js"></script>
<div id="app"></div>

Babel + JSX

class SomeComponent extends React.Component {
	constructor (props) {
    super(props)
    this.state = {
      first_name: '',
      last_name: ''
    };
  }
 
	componentDidMount() {
  	this.doSomething();
  }

  doSomething() {
    $.ajax({
      url: 'https://randomuser.me/api/',
      dataType: 'json',
      success: function(data) {
        this.setState({
        	first_name: data.results[0].name.first,
          last_name: data.results[0].name.last
        })
      }.bind(this)
    });
  }

  render() {
    return <div>Random name: {this.state.first_name +' '+ this.state.last_name}</div>
  }
};

ReactDOM.render(<SomeComponent />, document.getElementById('app'));