Technologies
Technical Approach
MIDI Keys is an online synthesizer built to interact with a MIDI device. MIDI stands for Musical Instrumental Digital Interface. MIDI is an important musical tool and is commonly used in the music industry today. Normally, users must download audio software to use MIDI; however, MIDI Keys provides a simple solution by allowing users to play their MIDI devices directly through the browser. MIDI Keys presents users with numerous samples to play with, allowing them to save samples to their user account or create music without signing in.
Requirements ▼MIDI keys implements a React front end and Express back end using a mySQL database to store user and sample information. WebMIDI, Tone.js, and AudioKeys are third-party libraries utilized to allow for MIDI interaction from the browser. Materials UI and Sass are used to built the front-end elements and icons features within the application.
Initially, I was largely unfamiliar with React and any of the third-party MIDI libraries utilized within this application, so I chose to learn these new technologies to improve my skills in development. I implemented React as the prominent language of this application as it largely relies on event listening and state changes, allowing it to function well with MIDI events and key presses.
Building this application included several risks and challenges, all of which I documented and prioritized in order to stay on track:
As of now, there are no outstanding issues in this application. However, this application will continue to be improved with new features including: recording functionality, additional samples, and a chord display.