Day 1: Drum Kit
First day and haven't done JavaScript in a long time so I was basically just following this tutorial character for character, but afterwards I did add MIDI input reading (and remap the terrible key choices).
Day 2: CSS & JS Clock
Again pretty closely following the tutorial, afterwards I added a clock ticking sound, music, and a hover effect on the clock to make it a little more interesting.
Day 3: CSS Variables & JS
Not much going on with todays but it's still quite a cool demonstration of JS interacting with CSS Variables, and I didn't really have anything unique to add to todays.
Day 4: Array Cardio
I was able to do one on my own. I got relatively close on some of the others and now I think I'm happy with what I've done, mostly just came down the syntax of JavaScript.
Day 5: Image Gallery
Lots of new CSS for todays! I added some fun and exciting sound effects as I thought the JavaScript side was lacking today. The transitionend event came in handy again today.
Day 6: Ajax Type Ahead
Definitely a cool and useful one today, I added the functionality of selecting suggestions, along with hover & click effects. I sorted the list by population because geolocation seems far too daunting.
Day 7: Array Cardio
I managed to do all of these on my own, evidence that this challenge is paying off! (Or that four questions wasn't sufficient.)
Day 8: HTML5 Canvas
Today's was a fun one! I followed closely along with the tutorial, then afterwards I added an eraser and resizing of the cursor using the scroll wheel, aswell as sound effects.
Day 9: Dev Tools
A useful set of tools for today, not much else to say about it though. I added music again.
Day 10: Checkboxes
I actually managed to do this one on my own, albeit with a couple Google searches along the way. Unfortunately no time for music and sounds today, just a boring old website.
Day 11: Video Player
I was able to complete couple seperate tasks on my own for this one, following along with the structure of the program. I added a fullscreen button after but I'm not sure how to integrate my controls.
Day 12: Konami Code
This one was pretty simple so I mostly added styles and audio, but I think it turned out quite nicely. I'm sure there's a better way to do this especially if you have multiple codes though.
Day 13: Slide Scroll
This is definitely one of the useful ones for other sites, the implementation here was a bit simple, but nonetheless a cool feature. A custom debounce function had to be made to slow down the scroll events.
Day 14: Reference vs Copy
Today's wasn't much of a project, just based around learning the difference between primitive and reference data types. So to spice it up a little, I added music.
Day 15: Local Storage
Useful skills today with local storage and event delegation, I added buttons for clearing, checking and unchecking all, aswell as sound design, as usual.
Day 16: CSS Mouse Move
Simple and fun one for today, taking inspiration from Day 12 I added a secret code but don't even bother trying to work it out.
Day 17: Sorting
I managed to this one on my own, but only with a trimStart function from stack overflow for trimming sequences of strings. I've now pretty much switched to using Wes' code.
Day 18: Reduce Timestamps
This one was pretty simple, sum the timestamps and the method seems quite naive at the moment, I'd like to expand it to support hours as well, and also to reduce the code into a one-liner.
Day 19: Webcam Fun
A really fun one for today, I mostly modified the styles aswell as expanding on the effects created. The layout isn't particularily responsive but oh well it's JS30 not CSS30.
Day 20: Speech Recognition
Not exactly sure how many practical uses this has in the browser environment, other than on Google, but nonetheless a cool one to know. I added a feature replacing 'haha' with '💀'.
Day 21: Geolocation
I don't really have much to say about today's, it doesn't seem to have much utility and was quite quick to implement.
Day 22: Hover Follower
In likeness to yesterday's, this was another simple one. But I think it's a least slightly cooler than yesterdays, it makes for an alright feature on a page. Obviously I added woosh sound effects.
Day 23: Speech Synthesis
Completing the other half of the Web Speech API today, an interesting one using the SpeechSynthesis interface. It's a shame there's no support for exporting the audio created through this method.
Day 24: Sticky Nav
Actually a simple but useful one I could use in a site, not to disrespect the other days but I don't really see myself using a compass in one of my sites.
Day 25: JS Events
Nothing too exciting today, it was Event Capture, Propagation, Bubbling & Once, I did make some buttons and toggles to display how it works though. Definitely important to know about.
Day 26: Hover Follow Dropdown
Today's was the extension of Day 22 into something that's actually quite cool. I'd certainly like to make some changes if I were to actually use it, fading away & sliding between.
Day 27: Click & Drag Scroll
I entirely did today's on my own (not that it was particularily complicated), but it's definitely a pretty cool feature to use on a site. I added the slowing down after you let go, it's not perfect but it works.
Day 28: Speed Scrubber UI
I almost managed to do today's on my own, but a couple things I did differently ended up with numbers not lining up. More mousemove & mousedown flags today.
Day 29: Countdown Clock
This is one of the projects that immediately has an obvious use case, (unlike some of the others). I did follow Wes' challenge of adding hours & animations to it, and I also added some quality SFX as usual.
Day 30: Whack-A-Mole
Well, here we are at the last day. I added storing the highscore in local storage, aswell as music & sound effects. Enjoy.