section-engineering-education / engineering-education

“Section's Engineering Education (EngEd) Program is dedicated to offering a unique quality community experience for computer science university students."
Apache License 2.0
363 stars 890 forks source link

Introduction to Web MIDI API #2023

Closed Jasonochanji closed 3 years ago

Jasonochanji commented 3 years ago

We ask that you please be patient as our team works through approving and publishing all articles/tutorials in a timely manner. Allow 1-3 days for a topic to be reviewed and/or approved - allow 3-7 days for an articles to be reviewed and/or published.

Be sure to visit our Resources Page for tools, resources, and example articles to go over.

NOTE: (Please ensure that you have only one open issue + linked pull request at a time. This will ensure that we complete the article in a timely manner from inception to publishing.)

NOTE: We tend to stray away or tend not to publish reviews/comparisons of commercial product offerings.

We're looking for the first 2-3 paragraphs of the article that appropriately summarize what your article will be about.

Proposed title of article

Your title should be descriptive of the article/tutorial. Be Specific. Use keyword research to gain your article higher ranking.

Introduction paragraph (2-3 paragraphs):

The Web MIDI API specification defines a means for web developers to enumerate, manipulate and access MIDI devices - for example interfaces that may provide hardware MIDI ports with other devices plugged in to them and USB devices that support the USB-MIDI specification. Having a Web API for MIDI enables web applications that use existing software and hardware synthesizers, hardware music controllers and light systems and other mechanical apparatus controlled by MIDI.

With the fast development and adoption of the Web Audio API, we can now start building browser-based applications that bridge the gap between the cloud and the physical world. Not only does the Web MIDI API allows us to build synthesizers and audio effects, but we can even start building browser-based DAW (Digital Audio Workstation) similar in feature and performance to their current flash-based counterparts.

In this MIDI tutorial, I will guide you through the basics of the Web MIDI API, and we will build a simple monosynth that you will be able to play with your favorite MIDI device. we’ll also cover the basics of MIDI and the Web MIDI API to see how simple it can be to create a web app that responds to musical input using JavaScript.

Key takeaways:

  1. Understanding web MIDI API
  2. Manipulating MIDI utilities in application
  3. Have basic understating working with frameworks
  4. Making use of browser utilities

References:

N/A

Templates to use as guides

hectorkambow commented 3 years ago

cool topic - approved @Jasonochanji

hectorkambow commented 3 years ago

@Jasonochanji just wanted to follow up on this topic as I'm clearing up the queue where possible? Can be re-opened when needed. Of perhaps I missed the PR this is attached to?