Reactronica: Music as a Function of State

on YouTube ↗08m

" summary

Claims React-style declarative code renders sound by treating music as a function of state, implemented with ToneJS and React Hooks and Context. Live demos show a piano-roll step sequencer with BPM and steps array, synths with reverb, a sampler driving kick/snare/hihat and bass, a realtime ukulele tab editor and scanned 1800s sheet music, plus a (very) early browser DAW prototype. Tracks expose an onStepPlay callback for UI-audio sync; code is on GitHub.

AI-written summary · about

" chapters (8)

1. 0:00Intro
2. 0:36Function of State
3. 0:56Reactronica
4. 3:46Adding UI
5. 4:46Working with UI
6. 5:24Sheet Music
7. 6:04Audio Workstation
8. 7:11Outro

" related talks

• 19mBeats in the browserKaho Cheung · Next.js Conf 2022
• 35mReact beyond markupPeter Onneby · XebiCon'17
• 22mMusic of ReactVladimir Barsukov · CSS-Minsk-JS 2018
• 12mMusic of ReactWowa Barsukov · React Amsterdam 2018
• 26mReact & Web Audio Api: Building a MIDI InteracePeter Piekarczyk · React Rally 2015
• 32mSequencing Audio Using React and the Web Audio APIBruce Lane, Vincent Riemer · React Amsterdam 2017
• 39mBecome a Developer of Electronic MusicNir Kaufman · NationJS Frontrunners React 2019
• 14mMusical Creativity in the BrowserScott Ammon · CascadiaJS 2020