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 the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.