Pages serves the site
Everything in public/ is static HTML, CSS, and JavaScript. No build system, server, or database is required.
STATIC / EDITABLE / YOUR DESIGN
Your beats. Your look. No platform skin.
This is a small, hand-coded shell. Replace the copy, layout, colors, and catalog with your own design; Cloudflare Pages serves the site while R2 supplies public audio previews.
To enable previews, set previewBaseUrl in assets/config.js and add tracks in assets/catalog.js.
BEAT CATALOG
Swap this placeholder for your own listing.
The sample has no public audio file configured, so it deliberately cannot play. Once your R2 public-preview domain is in
assets/config.js, add each preview path in assets/catalog.js.ARCHITECTURE
Keep the public layer simple.
R2 serves previews
Host short, lower-bitrate MP3 previews on a public R2 custom domain. The browser player reads those paths from the catalog file.
Paid files stay private
Never upload masters, WAVs, stems, or paid files to the public-preview bucket. Private delivery needs a future checkout plus controlled download links.
OWNER HANDOFF
Three files are your everyday control panel.
public/index.html
Change the page
Write your brand story, update sections, and replace this starter structure with your own art direction.
public/assets/catalog.js
Change the beats
Add titles, tags, BPM, key, preview paths, and any outgoing purchase link you choose to use later.
public/assets/config.js
Change the audio origin
Set the public R2 custom-domain URL once, then keep every preview path tidy and relative.