Metal Rater

live
|Started Jul 2026|Updated Aug 2026

A simple JS app to find your favourite metal band. Built strictly for learning purposes and to test my customized workflow — ELO-based ratings plus a test of development speed.

JavascriptClaude CodeGoogle StitchNetlfiyPerplexitycustom ticket systemObsidian
data managementmusiclearningbuilding workflowfun

What it does

Metal Rater is a very simple app, built in very limited time — half a day from idea to going live. It doesn’t solve a real world problem but was built purely for learning purposes and fun:

  • built on top of an existing GitHub project (core + different data sets)
  • connecting, validating and optimizing my tech stack and release flow
  • an exercise in data manipulation, normalization, deduplication, reformatting and scraping
  • usability and app testing

Approach

I set myself the challenge: how fast can you go from an idea you stumbled on online to your own working solution? It took half a day in total, mostly due to data scraping and manipulation. Everything else was built within an hour.

  1. I found a movie-ranking project on GitHub. I’m not that into movies, but I am into music. The logic was there, it was open-sourced and available, but I didn’t like the visuals — so I took the source and made my own adjustments.

  2. Perplexity did the research for open data sets. Finding data sources, verifying data and surfacing them online looked simple at first, but the devil is in the details — data on niche subjects can be tricky.

  3. Data cleansing, format changes, testing, and rescraping due to missing information and categorization took the most time. Claude did the heavy lifting in data manipulation, bringing raw data from multiple sources into one single source of truth — though I still ran into plenty of challenges in data sourcing, manipulation and wrangling in general.

Visuals

As often before, I used Google Stitch for rapid prototyping of interfaces. This one was simple to build — it just needed a few rounds of adjustments once the direction was clear. I used the extra scraping time that was needed to solve data issues to build the interface in parallel.

Go live

My own setup and tech stack are validated to the point that going live was a matter of minutes. No dedicated domain — just Netlify connected to GitHub, and everything is live within minutes. Basic SEO/GEO is part of the default project setup from the start; tracking is optional for this project and not implemented yet. The whole project is auto-documented while building, with release management steered by Claude.

Learnings

  • data management: scraping, reformatting, deduplication, etc.
  • building a vanilla JS application
  • a minimalist publishing workflow
  • hardening my customized Claude Code project setup and workflow
  • automated and standardized project setup via Claude Code, based on my own skill set
  • niche data can be tricky — always validate, then validate again
  • just because you’re sitting on a pool of data doesn’t mean it can be used directly in a user-facing app. Testing and slicing the data sets down was necessary to a reasonable extent — the app now offers real expert users the option to dig deeper, but the core experience is built around a curated subset of popular data.