Untitled Launchpad Emulator

Github Link https://github.com/PurdueHackathonUntitledTeam/UntitledLaunchpadEmulator

Inspiration

Ableton Live but basically lightshow logics and complete on a web browser.

What it does

It plays Launchpad Lightshow project on the web browser with or without real hardware.

How I built it

We started it on React.Js. I first write all the code to parse all the project-related files in the project zip. Then implement the draft UI and the UI logic. In the end, my teammate is charged for finalized the UI and I went on to optimized the performance.

Challenges I ran into

I'm very new to ReactJs so I ran into a lot of general issues. With JavaScript, it's hard to get a precise timer and that takes me a lot of time. I also ran into performance issues with high concurrency rendering, but I was able to mitigate that by batching and syncing the rendering.

Accomplishments that I'm proud of

We were able to achieve a feature-complete web app that can compete with a desktop-only software that costs $799 on a webpage with no performance issue for Launchpad Lightshows within 24hrs. I think that's pretty amazing.

What I learned

A lot more about ReactJs and how to transversal all the component layers and reference passing. Also WebMidi API

What's next for Untitled Launchpad Emulator

Probably a more polished UI, more testing, and a title.

Built With

• react.js