🖖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