Drum Machine React - exporting from CodePen to VsCode

JavaScript
1

Hi, I was trying to export my Drum Machine project https://codepen.io/NicoCastel/pen/vYdexwr?editors=0010 with the idea to create a Repo on GitHub. To make this, I use create-react-app and all the things that come with it, because it seems pretty easier instead of make it from scratch (I’m not able in a reasonable time yet).

I was testing the app, and I noticed that, on the CodePen app, the volume works ad intended, but on the LocalHost, it doesn’t work. Any idea?

I can’t give you the Local files, but I have done something with import and export, and the app renders normal, except for that.

2

Why can’t you share the GitHub repo?

Without being able to test the code we will be hard-pressed to know exactly what is wrong.

1 Like
3

Ok, done, here is the link

after this little experience, I think it’s time to learn seriously how Git and GitHub work :face_in_clouds:

4

Open the browser console and look at the errors. There are 3 of them but the last is the one about the volume.

Uncaught TypeError: document.getElementsByClassName(...).forEach is not a function

getElementsByClassName returns an HTMLCollection which doesn’t have forEach on it. I would suggest you use querySelectorAll or you can turn the HTMLCollection into an array (you can use Array.from() or spread syntax).

Not 100% sure why it works on Codepen but I’m guessing the transpile done by Babel might have something to do with it.

BTW, keep the .gitignore that comes with create-react-app so the node_modules are ignored.

1 Like
5

Thanks for the help!

I think also that Babel could be the reason of that.

6

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.