Nitish Dayal, Software & Applications Developer
Last Commit Date: Dec 24, 2016

Course created by Wes Bos
Join the challenge (for free!) here - JavaScript30

This repository contains my written guides for the JavaScript30 course by Wes Bos. I wrote these in the hopes of expanding the ways in which people can access this course; not everyone has the data allotments or internet speeds or...whatever the case may be to load multiple high definition videos. Or, maybe, you prefer to have a text-based guide to follow along with/ refer back to. Orrr you're in a library and don't have headphones. Who knows! If you want some documentation to go along with those sweet Wes Bos vids, here you go.

DISCLAIMER: My approach to some of the challenges vary from the provided answers (found in the files that end with -FINISHED on the main repo). Some of the tweaks are just to include various 'best practices' and some have huge chunks of differences. I try to provide thorough explanations when I do sway from the path and explain why I chose to do so, but I want to make it clear that some of these guides don't go hand-in-hand with the videos.

Build 30 things in 30 days with vanilla JavaScript; no frameworks, libraries, etc. Pacing is totally up to the individual; if you feel like knocking out 30 challenges in 30 minutes, hey, more power to you, but that would miss the point of this course (IMO). The idea behind these exercises is to utilize small amounts of what would regularly be 'downtime' as moments in which we can build on our knowledge through some simple exercises.

I think it's fair to say that, coming into this course, you should have a decent grasp of JavaScript fundamentals. Comfort when working with functions, callbacks, arrays, and objects will help a great deal in working through the challenges. If you don't, don't worry and do it anyways <3. It might take you more than downtime to complete a challenge, but given that these exercises require you to work with those very topics time and time again, JavaScript30 is still an excellent learning resource.

The starter files (available here) include solutions to most challenges, so this isn't really meant to be taken as some kind of competition. JavaScript30 is focused more on helping developers enhance their current skillset and reducing developer reliance on external JS libraries; if it can be done with a JS library, it can (probably) be done with vanilla JS.

1. [JavaScript Drum Kit](./exercises/01\ -\ JavaScript\ Drum\ Kit/)
2. [JS + CSS Clock](./exercises/02\ -\ JS\ +\ CSS\ Clock/)
3. [CSS Variables](./exercises/03\ -\ CSS\ Variables/)
4. [Array Cardio, Day 1](./exercises/04\ -\ Array\ Caro\ Day\ 1/)
5. [Flex Panel Gallery](./exercises/05\ -\ Flex\ PanelGallery/)
6. [Type Ahead](./exercises/06\ -\ Type\ Ahead/)
7. [Array Cardio, Day 2](./exercises/07\ -\ Arra Cardio\ Day\ 2/)
8. [Fun with HTML5 Canvas](./exercises/08\ -\ Fu with\ HTML5\ Cans/)
9. [Dev Tools Domination](./exercises/09\ -\ DevTools\ Domination/)
10. [Hold Shift and Check Checkboxes](./exercis/10\ -\ Hold\ Sh and\ Check\ Checkboxes/)
11. [Custom Video Player](./exercises/11\ -\ Custom\ Video\ Player/)
12. [Key Sequence Detection](./exercises/12\ -\ Key\ Sequence\ Deon/)
13. [Slide in on Scroll](./exercises/13\ -\ Slide\ in\ on\ Scroll/)
14. [JavaScript References vs. Copying](./exercises/14\ -\ JavaScri\ References\ VS\ Copying)
15. [LocalStorage](./exercises/15\ -\ LocalStorage/)
16. [Mouse Move Shadow](./exercises/16\ -\ Mouse\ Move\ Shadow/)
17. [Sort Without Articles](./exercises/17\ -\ Sort\ Without\ Articles/)
18. [Adding Up Times with Reduce](./exercises/18\ -\ Adding\ Up\ Times\ with\ Reduce/)
19. [Webcam Fun](./exercises/19\ -\ Webcam\ Fun/)
20. [Speech Detection](./exercises/20\ -\ Speech\ Detection/)
21. [Geolocation](./exercises/21\ -\ Geolocation/)
22. [Follow Along Link Highlighter](./exercises/22\ -\ Follow\ Along\ Link\ Highlighter/)
23. [Speech Synthesis](./exercises/23\ -\ Speech\ Synthesis/)
24. [Sticky Nav](./exercises/24\ -\ Sticky\ Nav/)
25. [Event Capture, Propagation, Bubbling, and Once](./exercises/25\ -\ Event Capture,\ Propagation,\ Bubbling\ and\ Once/)
26. [Stripe Follow Along Nav](./exercises/26\ -\ Stripe\ Follow\ Along\ Nav/)
27. [Click and Drag](./exercises/27\ -\ Click\ and\ Drag/)
28. [Video Speed Controller](./exercises/28\ -\ Video\ Speed\ Controller/)
29. [Countdown Timer](./exercises/29\ -\ Countdown\ Timer/)
30. [Whack A Mole](./exercises/30\ -\ Whack\ A\ Mole/)