https://github.com/bbc/r-audio

A library of React components for building Web Audio graphs.
https://github.com/bbc/r-audio

audio-processing react web-audio

Last synced: about 1 month ago
JSON representation

A library of React components for building Web Audio graphs.

• Host: GitHub
• URL: https://github.com/bbc/r-audio
• Owner: bbc
• License: other
• Created: 2018-04-17T15:37:15.000Z (about 6 years ago)
• Default Branch: master
• Last Pushed: 2023-04-24T01:28:39.000Z (about 1 year ago)
• Last Synced: 2024-05-19T20:02:16.631Z (about 2 months ago)
• Topics: audio-processing, react, web-audio
• Language: JavaScript
• Homepage:
• Size: 3.13 MB
• Stars: 174
• Watchers: 16
• Forks: 13
• Open Issues: 10
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Lists

• awesome-stars - r-audio
• awesome - bbc/r-audio - A library of React components for building Web Audio graphs. (JavaScript)

README

        
# r-audio

A library of React components for building [Web Audio](https://www.w3.org/TR/webaudio/) graphs.

## Objectives

👉 make Web Audio graph code more readable and representative of the graph shape

👉 make it easier to create reusable graphs

👉 make state management easier with React's one-way data bindings and single source of state

👉 represent any arbitrary directed graphs in JSX

👉 support all non-deprecated audio nodes including `AudioWorklet`

👉 allow interspersed HTML components in audio components

## Installation

```bash

npm install r-audio

```

## Usage example

Stereo waveshaper + amplitude modulation on a WAV loop

```jsx

 this.audioContext = ctx}>

  

    

    

      

        

        

        

        

      

      

        

        

      

    

  

```

## Useful links

- [Full usage examples](https://github.com/bbc/r-audio/tree/master/examples)

- [API Reference](https://github.com/bbc/r-audio/wiki/API-Reference)

## Development setup

```bash

npm install

npm run dev

```

The demo page will be served at `localhost:8080`. Use a recent version of Chrome or Firefox for the best experience.

Firefox Web Audio developer tool is especially handy (bear in mind Firefox does not support AudioWorklet as of 17 April 2018).