Unsure how to get React to render in codepen

1

I’ve been working on the Front End Libraries projects over the last couple weeks and I’ve been kinda stumped on why my code wont render. I think I have the ReactDOM.render done correctly, but if that is the case I don’t know what I did wrong that it wont render. My codepen is here: https://codepen.io/AugustTGuenther/pen/GRomxqG. Any help or advice is greatly appreciated. I’ll be watching this thread relatively closely so I can answer questions.

2

Hello there.

Some things to note when using CodePen:

  1. CodePen does not expect any content outside the body tags.
  2. All meta, link, and script information must be put in the :gear: settings section of the HTML editor.
  3. You do not need to/cannot link the CSS in your HTML, if you place the CSS in the appropriate section.
  4. If your project uses React, use the Babel preprocessor, and link the CDN in the appropriate :gear: section.
  5. The editors offer the ability to format and analyze your code, providing useful information about forgotten closing tags etc.

You need to add the React and ReactDOM libraries to your project.

If you are still confused with how to use CodePen, please read the official documentation.

Hope this helps

1 Like
3

It looks like you don’t have React imported at all. You can use this CodePen (from the official React tutorial) to compare settings: https://codepen.io/gaearon/pen/oWWQNa

1 Like
4

Thank you so much for your reply, I didn’t really understand what importing react meant exactly or how it would be done since the curriculum doesn’t really go over it much.

5

This is not correct: getElementFromId

I suggest you Google that, and see what comes up…

1 Like
6

Literally noticed that exactly as you typed it back, duh!! Thank you!!