An open API service indexing awesome lists of open source software.

https://github.com/xyflow/react-flow-web-audio

A simple Web Audio playground built with React Flow. Follow the tutorial to learn how to build it yourself.
https://github.com/xyflow/react-flow-web-audio

Last synced: 8 months ago
JSON representation

A simple Web Audio playground built with React Flow. Follow the tutorial to learn how to build it yourself.

Awesome Lists containing this project

README

          

# React Flow Web Audio Playground

This repo contains a small Web Audio playground built with React Flow. Go check
out the [tutorial](https://reactflow.dev/learn/tutorials/react-flow-and-the-web-audio-api)
if you want to build your own from scratch!

### Features of the playground include:

- Create new audio nodes
- Update node data with some UI controls
- Connect nodes together
- Delete nodes and connections
- Start and stop audio processing

### The tutorial covers React Flow topics including:

- Using zustand for state management.
- Custom nodes and controls.
- "Running" or interpreting a React Flow graph.

## Development

This app was built using [Vite](https://vitejs.dev/) for development.

### Installation

Before you start, you need to install the dependencies:

```sh
npm install
```

### Spin up a dev server

```sh
npm run dev
```

### Build

```sh
npm run build
```