use-midi is a library that let you bind midi events to any component.
To install the entire use-midi
lib:
#Yarn
yarn add use-midi
#NPM
npm i use-midi
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.
More info about the project can be found here.
Examples and tutorials can be found here
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()
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 |