Make Beats with React
The Tweet
Later That Day...
Make Beats with React
The Loop Machine
Steps, beats, bars and all the good stuff.
The Tempo
Beats per minute (BPM)
Browser Beatmaker
splice.com/sounds/beatmaker
We give instructions to the machine, let it figure out what to do
.
Declarative
Meet React-Music
Why React-Music?
- Leverages Web Audio API
- Composable React Components
- Clean, simple API
Song
Sequencer
Instruments
- Sampler
- Synth
- Monosynth
Sampler
Plays sample from audio file.
Synth
Oscillator, wave form, melody.
Monosynth
Single note. No chords. Glide!
Demo Time!
Live examples... what could go wrong?
Filters & Effects
Elaborate sounds. Add depth.
Super Hard!
Tweak. Save. Listen. Tweak again.
Ugh.
A Little Experiment
Extending React-Music.
Live Controls
Play with instruments & effects
in real-time
.
Demo Time!
A basic live-mixing console.
github.com/simonswiss/react-music
react-music-mix.surge.sh
Code
Live Demo
Promising Start
React-music is 3 weeks old only.
- good traction early on
So Far So Good
- featured at React Rally
- hot reloading by Dan Abramov
- song arrangement in roadmap
yo Jed, k dubs says what up homie
- Ken Wheeler
”
Code + Music
It's good fun.
Beer + Pizza
It's good fun too!
Thank You.
@simonswiss
Made with Slides.com