Features & Technology Stack

Everything My Music offers, split by who can use it.

Feature Overview

Published — for listeners

Track library with search by title, artist, or album
Audio player with play, pause, seek, and volume controls
Next / previous track navigation
Smooth background art cross-fade on track change
Responsive layout — works on mobile and desktop
Static site export for fast, lightweight deployment
Multi-theme color schemes with live switcher
Development issue log with commit-level resolutions

Admin — for developers

Track upload with audio file and auto duration detection
iTunes metadata lookup by title / artist
Automatic cover art download from iTunes
Inline editing of track metadata and audio files
Created-at / updated-at timestamps on every track
Server-only data layer with JSON file storage
One-click publish with auto-generated commit message
File upload validation (type, size, extension)
Production environment guard on all API routes
Safe git operations with argument array (no shell injection)
npm run audit — dependency vulnerability checker
Security lint rules via eslint-plugin-security

Technology Stack

Layer	Technology	Purpose
Framework	Next.js 16	App Router, static export
UI Library	React 19	Client components, hooks, context
Language	TypeScript	Type safety across the entire stack
Styling	Tailwind CSS v4	Utility-first styling with @theme
Testing	Vitest + RTL	Unit tests with React Testing Library
Linting	ESLint	eslint-config-next, core-web-vitals, security plugin
Data	JSON file	Server-only fs read/write, no DB
Audio detection	HTMLAudioElement API	Client-side duration from metadata
External API	iTunes Search API	Metadata and cover art lookup
Theming	CSS custom properties	7 color schemes with runtime switching
AI tooling	opencode	Conversational development workflow

Architecture

Public (static export)          Admin (dev only)
┌──────────────────────┐    ┌──────────────────────┐
│   TrackView          │    │   AdminPage           │
│   AudioPlayer        │    │   Track upload form   │
│   BackgroundArt      │    │   iTunes search       │
│   TrackList          │    │   Edit track UI       │
└──────┬───────────────┘    └──────┬────────────────┘
       │                           │
       │    PlayerContext          │
       │    (React context)        │
       └──────┬────────────────────┘
              │
     ┌────────▼────────┐
     │  data/tracks.ts  │  server-only
     │  data/tracks.json│  JSON file
     └─────────────────┘