Strumrr — project screenshot

Project · Full-Stack Engineering

Strumrr

A full-stack guitar practice platform — daily logging, streaks, heatmaps, and instructor video feedback with browser-side compression.

By Aman Chandra H

About the project

A full-stack web app for music students to log daily practice sessions, track streaks and contribution heatmaps, and upload practice videos for instructor feedback. The instructor dashboard provides a feedback inbox and class-wide analytics.

Built on React Router 7 with server-side rendering, running on a Hono/Node.js server. Data lives in Turso (libSQL/SQLite) and videos are stored on Cloudinary. Deployed on Render with a health-check endpoint for uptime monitoring.

The standout engineering detail is the upload pipeline: videos are compressed entirely in the browser using Mediabunny and the WebCodecs API before they ever leave the device — cutting file sizes by more than 50% without degrading audio. Uploads then go straight from the browser to Cloudinary via signed requests, so large files never touch the server. A storage policy automatically keeps only each student's two most recent clips and deletes older ones, capping storage costs.

Security-wise: passwords are hashed with argon2, and a security-question flow handles password resets. The UI is mobile-first and responsive throughout, animated with Motion.

Built with

  • React Router 7
  • Hono
  • Turso
  • Cloudinary
  • Tailwind CSS