đź––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 |