So, I’ve written my code, and want to test it now.
I’ve made the application using React, in VSCode. How am I supposed to test the application in CodePen?
The app doesn’t even load when I paste my code.
I have the following files:
index.html
styles.css
App.js
index.js
I’ve copied the component from App.js to index.js, to render it directly in index.js, and not importing it from App.js, but still no rendering.
Any tips?
this is the test bundle link https://cdn.freecodecamp.org/testable-projects-fcc/v1/bundle.js, you can import it in your project for testing
one thing I don’t see in your Pen, is the importing of react, it’s not natively present in the CodePen environment so you need to use a proper link to a react cdn
Hello,
thanks for the input. I’ve updated the imports accordingly. Still, no rendering happening, which is weird. For reference, it’s working perfectly fine in my dev environment in VSCode, which is why I’m not understanding why I can’t get anything to render.
CodePen behaves differently than your local environment. Why don’t you host somewhere like GitHub pages?
So,
I took your advice, and used this guide to help me set it up: https://github.com/gitname/react-gh-pages if anyone else find’s themselves in the same situation.
Thank you for the tips and help!
Just to answer your question.
It is the CSS imports in the JS that are causing issues. Also, as long as you have the CSS in the HTML or the settings you don’t need it in the JS as well.
As an aside. Another option if you want a live editor is using Stackblitz or Codesandbox.
This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.