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://npmcdn.com/react@latest/dist/react-with-addons.js"></script>
<script src="https://npmcdn.com/react-dom@latest/dist/react-dom.js"></script>
<script src="https://facebook.github.io/react/js/jsfiddle-integration-babel.js"></script>

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

JavaScript 1.7

class ApiWrapper extends React.Component {

  constructor(props) {
    super(props);

    this.state = {
      response: {
      	"userId": 0,
        "title": 'nothing fetched yet',
        "id": 0,
        "body": ""
      }
    };
  }

  componentDidMount() {
    this._makeApiCall(this.props.endpoint);
  }

  _makeApiCall(endpoint) {
  	var that = this;
    fetch(endpoint).then(function(response) {
			return response.json();
    })
    .then(function(data) {
      that.setState({
        response: data
      });
    }).catch(function(error) {
      console.log('request failed', error)
    });
  }
 
  render() {
  	console.log(this.state.response);
    return (
    	<Child data={this.state.response}/>
    );
  }
}

class Child extends React.Component {
  render() {
    return ( <span> {
      this.props.data.title
    } </span>);
  };
}

var element = <ApiWrapper endpoint="https://jsonplaceholder.typicode.com/posts/1" />;

ReactDOM.render(
  element,
  document.getElementById('container')
);