Make a JavaScript Drum Kit in Vanilla JS

Overview

Save Big on Coursera Plus. 7,000+ courses at $160 off. Limited Time Only!

Grab it

A 30 day Vanilla JavaScript Challenge! Grab all the videos, exercises and coded solutions over at https://JavaScript30.com.

Syllabus

Make a JavaScript Drum Kit in Vanilla JS! #JavaScript30 1/30.
We build a CSS + JS Clock in Vanilla JS — #JavaScript30 2/30.
Woah! CSS Variables?! — #JavaScript30 3/30.
JavaScript Array Cardio Practice - Day 1 — #JavaScript30 4/30.
Flexbox + JavaScript Image Gallery — #JavaScript30 5/30.
Ajax Type Ahead with fetch() - #JavaScript30 6/30.
.some(), .every(), .find() and [...SPREADS] — Array Cardio Day 2 - #JavaScript30 7/30.
Let's build something fun with HTML5 Canvas - #JavaScript30 8/30.
14 Must Know Chrome Dev Tools Tricks - #JavaScript30 9/30.
JS Checkbox Challenge! #JavaScript30 10/30.
Custom HTML5 Video Player - #JavaScript30 11/30.
JavaScript KONAMI CODE! #JavaScript30 12/30.
Vanilla JavaScript Slide In on Scroll - #JavaScript30 13/30.
JavaScript Fundamentals: Reference VS Copy #JavaScript30 14/30.
How LocalStorage and Event Delegation work. #JavaScript30 15/30.
CSS Text Shadow on Mouse Move Effect - #JavaScript30 16/30.
JavaScript Practice: Sorting Band Names without articles - #JavaScript30 17/30.
How JavaScript's Array Reduce Works - #JavaScript30 18/30.
Unreal Webcam Fun with getUserMedia() and HTML5 Canvas - #JavaScript30 19/30.
JavaScript Speech Recognition #JavaScript30 20/30.
JavaScript Geolocation based Speedometer and Compass - #JavaScript30 21/30.
JavaScript Exercise: Follow Along Links - #JavaScript30 22/30.
JavaScript Text-To-Speech - #JavaScript30 23/30.
Vanilla JavaScript Sticky Nav - #JavaScript30 24/30.
JavaScript Event Capture, Propagation and Bubbling - #JavaScript30 25/30.
Stripe Follow Along Dropdown Navigation - #JavaScript30 26/30.
JavaScript Interface Challenge: Click and Drag to Scroll - #JavaScript30 27/30.
Build a Experimental Video Speed Controller UI - #JavaScript30 28/30.
Vanilla JS Countdown Timer - #JavaScript30 29/30.
Make a Whack A Mole Game with Vanilla JS - #JavaScript30 30/30.