Simon feedback request

Just finished SImon and need some feedback. Thanks in advance…
this would have been pure vanilla js but I used a module called Pizzicato to help with the sounds…

very nice. i like the glare background and the font for the round display. special touches. i used pizzicato as well, i remember it had a lot of other functionality that i meant to do something with someday. i learned some stuff by looking at your code and at the same time i don’t quite understand the style that you use…i guess because it is different than mine.

so first thing you reminded me that i can use my github assets. i use codepen with is actually aws, but i might cease giving them money soon and lose that…anyways…i didn’t know javascript has a .classlist method :slight_smile: although i kinda knew it had to.

so i have been coding for almost 3 months and i got into react maybe halfway in and got hooked and that is what i made simon with. what i haven’t seen much is how you organize your stuff into objects. like var $button = {... and then have each button be a key. the code seems very organized.

idk this is one of the better simons i’ve seen. good job.

Thank you Benjamin!

As for style… I really didn’t use anything that might be considered “good” style I suppose… I basically built the code in bits and pieces, tried to stay within a functional paradigm (basically trying to make each function only do one thing) although I know I drifted off of that in a few places. Some of the “style” is from watching youtube videos. Defining variables and functions in objects makes things more “human” readable, at least to me. I probably have some variables I don’t need anymore, I refactored the code several times trying to get things to work right, and pruned a ton of unnecessary garbage.

The play field buttons are actually a single image cut into four pieces with some css magic, thank you W3C! It’s basically a sprite sheet. I have other examples of that on codepen.

The var $button and $el … stuff is caching the DOM, just makes it so you’re not making the code search the DOM every time you call an event or change an element.

I can’t afford codepen pro, it would probably make life simpler! I found a host provider that has an excellent FREE tier level. I’ll probably start using more assets from there as there will be few steps, just FTP upload files to my host and point to the folder I uploaded to. github is great, but I still have to visit github to get the URL for the asset, so there are multiple steps I can eliminate by uploading to my own host. Of course I could also just build my projects there too and eliminate codepen altogether, but codepen seems to be the best place to showcase fcc projects.

I’m about to take the React plunge, from what I’ve seen I think I’m probably going to like it very well.