React Elements

React Elements — Are the smallest building blocks of React apps.

React Elements — Are plain objects, and are cheap to create.

Describes what you want to see on the screen.

React elements are immutable. Once you create an element, you can’t change its children or attributes.

const element = <h1>Hello, world</h1>;
ReactDOM.render(element, document.getElementById('root'));

To render a React element into a root DOM node, pass both to ReactDOM.render().

function tick() {
  const element = (
    <div>
      <h1>Hello, world!</h1>
      <h2>It is {new Date().toLocaleTimeString()}.</h2>
    </div>
  );
  ReactDOM.render(element, document.getElementById('root'));
}

setInterval(tick, 1000);

The only way to update the UI is to create a new element, and pass it to ReactDOM.render().