No child elements?

Hi there,

In React world if a component, in your case <Application />, has no child elements then we are not required to set an explicit closing tag, such as <Application></Application>.

By no child elements, it means within that return block of code there are no child elements such as <div> tags that need to be rendered when the <Application />component is returned.

React docs about components

Let me know if you still require further advice.

Cheers,

Thanks for your reply. For more detail, here is an example

I create a component class and render it into a div with id="treehouse"

var Application = React.createClass({
  render: function(props) {
    return(
      <div className="title">
        <h1>Tilte</h1>
      </div> 
    );
  }
});
ReactDOM.render(
  <Application />,
  document.getElementById('treehouse')
);

In the return block h1 tag is in the div tag but we still can render Application with <Application />

You could have it so that you could use. <Application><MyOtherComponent /></Application>. So in your Application component it would use the <MyOtherComponent /> and render it within your <Application /> component.

This allows you to create flexible components and compose UIs from a combination of components.

What I would suggest is to continue with the course and you'll see examples of this soon I'm sure.