Skip to content
All projects
Full-stack · 2026

Soundboard

A series graph for albums and EPs: track-by-track community ratings, personal ratings, and listener-heat context.

Overview

Soundboard plots an album as a series graph. Instead of collapsing a record into a single number, every track becomes a point on a line, so the shape of an album — the slow build, the mid-record sag, the run of three perfect songs — becomes something you can actually see and compare.

The graph runs in three modes: community scores aggregated from every rating saved to the database, your own personal ratings, and a listener-heat view that provides popularity context alongside quality. The design principle is a clean separation of ownership — the live music catalog owns identity, track order, durations, and artwork; Soundboard owns ratings; listener-stat style metrics stay secondary context and never drive the primary view.

The homepage seeds live from the catalog rather than a checked-in fixture, currently resolving Radiohead, Ye, J. Cole, Alvvays, and Charli xcx — including handling Kanye West's catalog identity as Ye. A local multi-artist catalog remains in the repo purely as a fallback when the live provider is unavailable.

What I built
  • On-demand catalog hydration

    No full music catalog is stored locally. Server-side API routes call the live catalog provider with a proper User-Agent, normalize responses, and lean on Next fetch revalidation for lightweight caching. The UI loads the album/EP list first, prioritizes the selected release's tracklist, then hydrates the rest of the artist through a polite background queue so a cold artist page is usable almost immediately.

  • Ratings that outlive the session

    Community scores hydrate from saved ratings in Postgres rather than living in local session state. Profile-specific track ratings flow through Prisma, so your ratings follow your account instead of your browser.

  • Supabase auth wired to profile identity

    Sign-up takes a username, email, and password; login accepts either the username or the linked email, with the email kept for recovery. The browser sends the Supabase access token to Soundboard's API routes, the server resolves the signed-in user, and that Supabase user id becomes the Soundboard profile id before any rating is loaded or saved.

  • Artist workspace

    A persistent selected-release summary, a dedicated discography rail, and an explicit album end cap — so navigating a deep discography never loses your place. Cover Art Archive artwork renders directly from release-group IDs.