Creating your first stateless React component

Let's take a look at the following example of how to create a React component:

var React = require('react');
var ReactDOM = require('react-dom');

var ReactClass = React.createClass({
  render: function () {
    return React.createElement('h1', { className: 'header' }, 'React Component');
  }
});
var reactComponentElement = React.createElement(ReactClass);
var reactComponent = ReactDOM.render(reactComponentElement, document.getElementById('react-application'));

Some of the preceding code should already look familiar to you, and the rest can be broken down into three simple steps:

  1. Creating a React class.
  2. Creating a React component element.
  3. Creating a React component.

Let's take a closer look at how we can create a ...

Get React.js Essentials now with O’Reilly online learning.

O’Reilly members experience live online training, plus books, videos, and digital content from 200+ publishers.