Music Recognition App
An interactive quiz where players guess songs from short, self-hosted audio clips — genre and difficulty selection, score tracking, and zero third-party API dependency.
How It Plays
A short clip drops, the clock starts, four options appear.
Case File
Three angles on the same build — click through.
Most "guess the song" web quizzes lean on a third-party music API for clips — which means rate limits, API keys, licensing friction, and the whole app breaking the moment that API changes its terms or goes down.
The goal was a quiz that owns its content end-to-end: self-hosted audio, no external dependency, no risk of the core feature silently breaking because a free-tier API key got throttled.
- Self-Hosted Audio — clips are served directly from the app's own storage, not fetched from a third-party service — removing the single biggest point of failure in most music-quiz projects.
- Genre & Difficulty Selection — players choose their own genre pool and difficulty before starting, which meant structuring the track library so filtering doesn't require re-fetching anything.
- Score Tracking — round-by-round scoring logic with timing built in, so faster correct answers are worth more, rewarding actual recognition speed over lucky guessing.
- Fullscreen Mode — a distraction-free play mode for the actual quiz experience, separate from the setup/menu screens.
A fully self-contained music quiz with zero external API risk, genre/difficulty personalization, and a polished play experience — built entirely with vanilla front-end tools and a lightweight Node.js back-end.
The main lesson here was about ownership: removing the third-party dependency meant more upfront work curating and hosting audio, but it also meant the app can't be broken by someone else's API changes — a trade worth making for something meant to actually stay live.
Difficulty Levels
Difficulty isn't just clip length — it's how much of the track's identity is exposed.
Stack
Click any tag to see how it's actually used in this project.
Click any technology above to see exactly how it's used in this build.