title: how to use react in Codepen with es6
body: <p><a href="http://codepen.io/JessieZhou/pen/VPgMdP" rel="noreferrer">http://codepen.io/JessieZhou/pen/VPgMdP</a> ,Here is a demo using React in CodePen, but the browser gives an error "Uncaught ReferenceError: Component is not defined". However, if I insert a line "import {Component} from 'react'" in the first line, the error will be "Uncaught ReferenceError: require is not defined". Is it possible that the usage of 'class' causes this problem? </p>
  
  <p>Here is my code:</p>
  
  <pre><code>//import {Component} from 'react'
  class MyInput extends Component{
     constructor(props){
       super(props);
       this.handleChange = this.handleChange.bind(this);
     }
  
     handleChange(e){
       this.props.update(e.target.value);
     }
  
     render(){
       return &lt;input onChange={this.handleChange} type="text"/&gt;
     }
  }
  ReactDOM.render(MyInput, document.getElementById('myinput'));
  </code></pre>
  
  <p>Here is my javascript settings in CodePen:
  <a href="https://i.stack.imgur.com/LcaMC.png" rel="noreferrer">javascript settings in codepen</a></p>