ReactPad
This project was bootstrapped with Create React App.
Live Demo
Feel free to try the live demo of this project on my website at: https://kurtchoi.dev/ReactPad.
Implementation Description
A React-based application that mimics the functionality of a 3x3 beatpad.
An audio file has been loaded to each DrumPad component via HTMLAudioElement API and then played appropriately by adding various Event Handlers: document.addEventListener() on keydown, keyup, and mouseup. Simultaneously, these Event Handlers also allowed each DrumPad's state, whether the key is being pressed or not by keeping a local state value of keydown, further allowing CSS effects to be carried out on activation.
Please check out /src/App.js for additional implementation detail.
How To Run
Simply run: npm start from the root working directory - website will be deployed locally at: https://localhost:3000.