JavaScript MIDI Synth Tutorial - Part 1 | Getting MIDI in the browser

The Web #MIDI API allows us to connect a MIDI-device to our computer and use MIDI inputs and outputs in the browser using #JavaScript. In this video we will get access to our connected MIDI-devices and talk about how it works, what the different MIDI-commands are etc. In video number 2 we will hook it up to the Web Audio API and make a cool little #synth.

[inang]

I dont know how much i could thank you for making this video series and this channel!!!

I love music but my parents made me take up IT.

I do not know how to combine them and always made them separate.

You are an angel!!!

SUbscribed please never delete these videos!

[mjhobo]

Came up in my recommended videos, you’re presentation style, speed and language is top tier tutorial content. Thanks!

[VuNguyen-tugv]

One of the best tutor channel !! thank you for sharing

[Benqo]

Amazing video! I got a bit confused by reading just Web Midi API documentation, but your video makes it so clear! Thank you a lot ;)

[jackyoungpiano]

thank you! this was just what I was looking for!

[GergPerson]

Awesome. Thank you so much. Very cool

[Royal-cysn]

Preciate you man! This was really helpful.

[RogerioSaldanha]

This simply... WORKS! :-D
Thank you!!! :-D

[frogfox]

you are my mentor !!!! I make a "virtual synth" on my browser with HTML CSS JS (click.event ) and some samples.
And whit this tuto i will learn how put my midi controller on USB to play on my "virtual synth" from a web browser ?

[epiphanysymptom-crisloren]

Have you found any method, coding magic or existing extension, for safari support? Thanks for the walkthrough. When companies won't update librarians/editor software but manmade online-based sites can- this is going to be super useful to keep my synthesizers on the shelf but plugged in lol.

[adamalfray]

Hi There! Thank you for making this tutorial and all your other tutorials! Greatly appreciated.

at 13:48:
I get an infinite loop of console.log messages stating that there has been a key press event when I am not touching my keyboard. Any idea of what this could be?

[diegocassinera]

In your switch statement on the midi command, the case of 127 will never be reached. If you midi device produces it, the code will break on like 21 with an array index error. 127 has only one parameter.

[raimonessilva]

It's work on browser mobile? I'm cannot to use here.

[frogfox]

it's work on FireFox or on Chrome only ?