Ecommerce Beat Shop
Huuman Beats
My beat shop, built from scratch: stream a track, pick a license, check out, and the files and contract arrive instantly.
challenge
Sell beats under my own brand without handing a marketplace a cut of every sale.
My contribution
Designed and built the storefront, audio player, checkout, digital delivery and admin studio.
result
A live shop where buyers preview, license, pay, and receive files and a contract in minutes.
Overview
Huuman Beats is a storefront a producer actually owns. Buyers preview beats in a player that follows them around the site, pick a license tier, check out as a guest or a member, and get their files plus a signed contract the moment payment clears. Behind it sits an admin studio that runs the whole business: products, pricing, orders, content, branding. No code, no redeploys.
The Problem
Most independent producers sell through marketplaces. They are easy to start on, but they take a cut of every sale, box in your branding, and shelve your catalog next to your competitors. If you want a brand people recognize, you need your own store. The catch is that a beat store means solving audio streaming, licensing, digital delivery, payments and content all at once.
Highlights
- One player, everywhere. Play, seek, queue and loop from any page. Tagged previews stream through signed links, so the untagged masters never leave the vault.
- Licenses, not just prices. Every beat carries tiers from MP3 lease to exclusive. Buy an exclusive and the beat comes off the store, and the site says so everywhere the license appears.
- Instant delivery with paperwork. Downloads per format the second payment clears, plus a real PDF contract stamped with the buyer’s name, the beat, the terms and an order reference.
- Guest checkout that can become an account. Buy without signing up, get a download link by email, claim the account later if you want it.
- Memberships, coupons and bundles. Monthly and yearly plans with download allowances, coupons with limits and expiry, and rules like buy two get one.
- An admin studio. Products, multi-file uploads with live progress, orders, customers, license templates, a blog, lead capture, branding, analytics IDs. All editable in the browser.
- Built to be found and measured. Product titles and metadata write themselves from BPM, key and genre, the sitemap builds itself, and the full purchase funnel reports to GA4 and Google Ads. Paid-search landing pages rewrite their headline to match the keyword that brought you.
How It’s Built
Next.js and TypeScript with PostgreSQL behind it, Stripe for checkout and subscriptions, and object storage for the audio. Files never pass through the app server: uploads and downloads go straight to storage over short-lived signed links, which keeps big stem archives off serverless functions. Stripe webhooks drive fulfillment. The handler writes the order and answers Stripe immediately, then generates the contract and sends the email in the background so nothing times out. Access control is enforced twice, at the edge and again in the API, with three roles deciding who touches what.
What Went Wrong, Briefly
The first audio player proxied streams through the app and got silently truncated by a response-size cap. The fix was the signed-link handoff above. Decimal prices arrived on the client as strings and cart subtotals came out as gibberish until every entry point coerced them. And the production webhooks failed for days for three stacked reasons: the endpoint pointed at a redirecting domain, the signing secret had never left my laptop, and the handler did too much before replying. Each was a one-line fix once found.
Outcome
Live at huumanbeats.com. A sales channel I own end to end: browse, preview, license, pay, download. I run catalog, pricing, content and branding from the studio without touching code.