Skip to main content

🖖use-midi

use-midi is a library that let you bind midi events to any component.

🖖

 version  codecov  Downloads  jsDelivr  minified size  types includes  license

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

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:

HookDescription
useFadeHandles the fade midi
useNoteHandles the note midi
useTurnHandles the turn midi
useMidiHandles multiple midi in the one hooks

More on the full documentation website...