<main id="app"></main>
var container   = document.getElementById('app');
var h           = React.createElement;
Hello.prototype = Object.create(React.Component.prototype);

function Hello() {
  React.Component.constructor.call(this);
  
  this.state = { message: 'hello' };
 
  this.componentWillMount = function() {
    console.log('Look in the console');
    this.props.children.property('hello');
  };
  
  this.render = function() {
    return h('div', {}, this.state.message + ' ' + this.props.text);
  };
};

var anything = { 
  property:  function(greet) {
    console.log(greet + ' from a property in anything');
  }
};

var HelloElement   = h(Hello, { text: 'World' }, anything);
var HelloContainer = h('h1', {}, HelloElement);
var App            = h('div', { children: HelloContainer });

ReactDOM.render(App, container);

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

  1. https://cdnjs.cloudflare.com/ajax/libs/react/16.4.1/umd/react.production.min.js
  2. https://cdnjs.cloudflare.com/ajax/libs/react-dom/16.4.1/umd/react-dom.production.min.js