🖖use-midi
use-midi is a library that let you bind midi events to any component.
Installation
To install the entire use-midi lib:
#Yarn
yarn add use-midi
#NPM
npm i use-midi
Getting started
git clone https://github.com/tseijp/use-midi
Run the development server:
cd use-midi
yarn init
yarn start
- open browser and visit localhost:3000
- Now you can go to our demo, and try its usage.
Documentation and Examples
More info about the project can be found here.
Examples and tutorials can be found here
What does it look like?
React javascript
import { useNote } from 'use-midi'
function Example() {
// Set the note hook
const bind = useNote((state) => {/*~~*/})
// Bind it to a component
return <div {...bind()} />
}
Vanilla javascript
// script.js
const target = document.getElementById('drag')
const noteMidi = new NoteMidi(target, (state) => {/*~~*/})
// when you want to remove the listener
noteMidi.destroy()
Available hooks
use-midi exports several hooks that can handle different midi:
| Hook | Description |
|---|---|
useFade | Handles the fade midi |
useNote | Handles the note midi |
useTurn | Handles the turn midi |
useMidi | Handles multiple midi in the one hooks |