Song Fight Arena
Two Songs Enter. One Song Stays.
A weekly music competition where two songs go head-to-head, visitors vote anonymously, and a champion defends their title each week.
In TestingWhat it is and why I built it
I've been involved in music most of my life, mainly performing in bands and writing. I'd had the idea for a song voting competition for a long time, and the idea of a "Song Fight" sounded fun to me, especially with a winner-stays atmosphere. It reminds me of video game arcades in the 80s, where you had to fight to play, and the winner stayed on the machine until someone beat them.
I'm hoping to grow Song Fight Arena into a community that helps bands get real exposure.
How it works
Artists submit a song by pasting a YouTube link on the Submit Song page, along with their band name and email. Every submission starts in a Pending state and needs admin approval before it goes live.
Once approved, a song joins the Undercard, a ranked leaderboard where every active song competes for votes all week long. Anyone can vote once per song per day, and each vote pushes that song further up the rankings.
At the same time, the homepage features the main event: a head-to-head bout between the reigning Champion and a Challenger. Visitors vote for their favorite over a 7-day window, with a live vote tally and a split percentage bar showing the fight in real time.
At the end of each week, both contests resolve together. The Challenger has to strictly outscore the Champion to take the title, ties go to the defending Champion, so the loser drops back down to the Undercard. At the same moment, the #1 ranked Undercard song gets pulled up to become next week's Challenger. Votes clear, and a new week begins.
The Fight Card
Everything about Song Fight Arena leans into the combat framing. Songs are fighters, the main matchup is a battle, the rankings are a fight card, and losing sends you back to the Undercard. Even the About page has a name to match: The Rules of Engagement.
The Arena's live scoreboard is the centerpiece: a split progress bar, gold for the Champion and red for the Challenger, that shifts as votes come in. You can watch a fight swing in real time.
Champions hold the homepage spotlight for as long as they can defend it, and long reigns become their own kind of legend. Below the main matchup, the homepage also spotlights the top 3 Rising Undercard Fighters, so there's always a next challenger to root for.
When the weekly reset fires, bands get an email letting them know where they stand: whether they've won, or whether they've just been called up to fight for the title.
See it in action
What's next
Song playback currently runs through an embedded YouTube player. The next step is moving to Spotify, both to get a cleaner listening experience and to move off YouTube's audio-only playback gray area. A prototype using direct audio file playback is already in the works.
Tech stack
- PHP 8.2, procedural, on HostGator shared hosting. No framework, no build system.
- MySQL for storage: songs, bands, votes, the current fight status, and championship history.
- Tailwind CSS, HTMX for page navigation without full reloads, and Alpine.js for reactive UI like voting and the audio player.
- No stored passwords anywhere. Voting is IP-based, one vote per song per day. Admin access uses a magic-code login sent to a stored email, with a session timeout after 30 minutes idle, and a rotating security token gates sensitive operations like the weekly reset.
- Runs in separate QA and Production environments from the same codebase, with QA auto-deploying through GitHub Actions and Production deployed manually.