react component

react-1.js

'use strict';

let Hello = function (props) {

  return {

    props, // set props

    render () {

      // get `word` from props obj with
      // es6 destructuring:
      const { word } = this.props;

      return (
        // Fill in the { blanks }
        <p>Hello, { word }!</p>
      );
    }
  };

};

export default Hello;

react-2.html

<script type="text/jsx">
  var word = 'puppy';
  var content = document.getElementById("content");

  React.render (
    <Hello word={ word } />,
    content
  );
</script>

<div id="content"></div>