Real time audio and synthesis in Gleam using the Web Audio API.
Gleam 73%
JavaScript 27%

README.md

beep #

Say (or sing) hi to beep! Beep is a friendly little library for making sounds with the Web Audio API. Similar to how frontend libraries like Lustre or React provide a declarative wrapper around low-level DOM APIs, beep makes it simple to describe audio processing graphs and handles the hard work of making it real under the hood.

Let's make some sound:

import beep
import beep/param
import gleam/javascript/promise

pub fn main() {
  let engine = beep.new()
  let graph = [
    beep.oscillator([param.frequency(220.0)], [
      beep.gain([param.gain(0.2)], [
        beep.destination(),
      ]),
    ])
  ]

  use _ <- promise.await(beep.start(engine))

  beep.commit(engine, graph)
}

Note: while this example shows off the basic api, you might find it doesn't work if you run it in the browser. That's because adtech stops us having nice things. In most modern browsers, an audio context (or a beep.AudioEngine) can only be started in response to a direct user interaction like a button click.

Hey that wasn't so bad! Notice how the structure of graph dictates the connections between nodes. For comparison, here's the equivalent code in vanilla JavaScript working directly with the Web Audio API:

async function main() {
  const context = new AudioContext()

  const oscillator = context.createOscillator()
  oscillator.frequency.value = 220

  const gain = context.createGain()
  gain.gain.value = 0.2

  await context.start()

  oscillator.start()
  oscillator.connect(gain)
  gain.connect(context.destination)
}