First React Component not working

JavaScript
1

Tell us what’s happening:

Your code so far


class MyComponent extends React.Component {
constructor(props) {
    super(props);
}
render() {
    return(
    <div>
     <h1>My First React Component </h1>  
    </div>
    );
}
}

ReactDOM.render(<MyComponent />,<div id='challenge-node' ></div> );

Your browser information:

User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/79.0.3945.117 Safari/537.36.

Challenge: Write a React Component from Scratch

Link to the challenge:
https://www.freecodecamp.org/learn/front-end-libraries/react/write-a-react-component-from-scratch

2

Go back to this challenge for a refresher on ReactDOM.render()

https://www.freecodecamp.org/learn/front-end-libraries/react/render-html-elements-to-the-dom

3

Hi there,

So the challenge has the following text " There is a div with id='challenge-node' available for you to use." What it means is that freecodecamp has already created that root div in the document for you to be able to render your component.

So what you need to do is find that div, and you can do so by passing document.getElementById('challenge-node') instead of <div id='challenge-node' ></div> as the second argument of ReactDOM.render().

1 Like
4

@Rayhatron Thank you very much for your suggestion… The error is solved now… :smile:

1 Like