ReactDOM render on Codepn

Hello, I’ve been trying to render a simple component but I can’t seem to get it to work. I’ve tried multiple approaches but it still shows nothing.

I have this in my HTML

<div id="root"></div>

Then I have this in JavaScript. Babel is enabled, I have added the necessary external scripts (react, react-DOM)

class TestComponent extends React.component {
  constructor(props) {
    super(props);
  }
  render() {
    return (
      <div>
        <h1>test</h1>
       </div>
    )
  }
}

ReactDOM.render(<TestComponent />, document.getElementById("root")); 
1 Like

I think it should be React.Component with a capital C.

If this doesn’t help, try to open up the console and see what’s error are thrown.
(an maybe share the pen link too)

hope it helps :+1:

EDIT: sorry I missed the link on my first reply.
I’ve checked it now and I can confirm that on my end changing the capital C made the Component render on the page :slight_smile:

2 Likes

Hello. I think Marmiz is right. You need to right React.Component instead of React.component.

2 Likes

Yes, thank you, this solved the problem

1 Like