I'm doing Wes Bos' #Javascript30 and thought it'd be fun to do some restyling of each exercise and sharing on
@CodePen
. Here's Project #2: codepen.io/xdesro/pen/RxjxrY
@CodePen
(Out of order, but here's Project #1, a JavaScript drum kit!) codepen.io/xdesro/full/aEVYam/
#Javascript30 Project #6 on
@CodePen
-- a cities and populations type-ahead form! Peep it: codepen.io/xdesro/full/VyXEoR/
#Javascript30 Number 8! Just a cool drawing app with HTML5 canvas. Check it out on
@codepe
: codepen.io/xdesro/full/GyGLKp/
Project #13: (I know I'm out of order! I got caught up with some other stuff) adding and removing a class on scroll for reveal animations. #Javascript30 on
@CodePen
codepen.io/xdesro/full/KZbzjR/
#Javascript30 Project #11: A custom-styled video player! Complete with auto updating progress bars and CSS vars for color.
codepen.io/xdesro/full/RxvPOP/
#Javascript30 Project #15: A to-do list with to-dos that persist using LocalStorage! Awesome! Peep the CodePen!
codepen.io/xdesro/full/zROLKr/
#Javascript30 Project #16: Float, mouse-controlled text shadows! What grace! What poise! What raw talent! Check out the
@CodePen
here:
codepen.io/xdesro/full/rJBrgj/
#Javascript30 Project #17: Sorting Without Articles - At first, the project was just sorting the list and changing the HTML content of an unordered list, but I thought it might be tight to animate the sorting, so SHAZAM check it out.
@wesbos
notice me ❤
codepen.io/xdesro/full/xYKydo/
#Javascript30 Project #19: A custom photobooth with the mediaDevice API and HTML5 canvas, featuring toggle-able effects and downloadable photos! JS got a little messy on this one, so I'll loop back and clean it up at some point.
codepen.io/xdesro/full/KQPbzz/
#Javascript30 Project #20: Speech recognition. I tried like 5 times to record this GIF, but apparently speech recognition isn't super strong in a noisy coffee shop...
codepen.io/xdesro/full/OQJZZL/
#Javascript30 Project #21: Geolocation. Works better on mobile 😉
codepen.io/xdesro/full/GQRdKY/
#Javascript30 Project #22: A following-along link highlighter! Watch it soar across the page! Stunning!
codepen.io/xdesro/full/bLGKVB/
#Javascript30 Project #23: You've heard of "speech recognition", now get ready for "speech synthesis" -- this one is much more fun to play with. Check out the Codepen.
codepen.io/xdesro/full/ZrExpd/

