Beats in the Browser: Coding Music withJavaScript
summary
A browser-based drum rig that actually plays: code loads WAV samples into the Web Audio API, uses Tone.js to simplify playback, accepts USB pads via the Web MIDI API, and runs a working 16-step sequencer with adjustable BPM (3–200). Demo shows live MIDI triggering, recording to an audio element, and a Bluetooth heart-rate monitor mapped to BPM. Lots of handwritten node setup is replaced by library calls; the demo mostly works live.
AI-written summary · about
chapters (10)
- 0:00Music and drum machines
- 5:17Web Audio API basics
- 8:31Creating beats with Web Audio
- 12:00Simplifying with Tone.js
- 13:27Connecting MIDI devices
- 19:12Browser-based sequencer
- 25:19User interaction and MIDI setup
- 31:26Controlling beats via Bluetooth
- 36:46Visualizing sound
- 38:47Closing and resources
related talks
31mBeats in the Browser - Coding Music with JavaScript
44mBeats in the Browser - Coding Music with JavaScript
40mBeats in the Browser - Coding Music with JavaScript
32mBeats in the Browser
40mLiveJS: Making Music with JavaScript
14mMusical Creativity in the Browser
52mLive Musical Coding: You Code? Become a Composer with WebAudio and WebMIDI!
46mLive Coding Music: Can You Code? Become a Composer with WebAudio and WebMIDI!