GitSound
April 10, 2026 · View on GitHub
Transform any GitHub repository's commit history into generative algorithmic music.
Live demo: yoglib.github.io/gitquest
Features
- Commit-driven music: BPM, scale, voices, and energy are derived deterministically from your repo's commit patterns, fix ratios, and contributor activity — the same repo always sounds the same.
- Tone.js synthesis: Up to 4 layered voices (melody, bass, pad chords, kick drum) synthesized entirely in the browser.
- Manual overrides: Tune BPM, scale, reverb, voices, and energy on top of the computed defaults without leaving the page.
- Light / dark / system themes: Two custom OkLch purple themes that follow your OS preference or a manual toggle.
- GitHub token support: Add a Personal Access Token in settings for higher API rate limits.
- No backend: Fully static — runs on GitHub Pages with no server.
Tech Stack
| Layer | Library / Tool |
|---|---|
| UI | React 18, TypeScript 5.6 |
| Routing | React Router 6 (hash-based) |
| State | Zustand 5 |
| Audio | Tone.js 14 |
| Styling | Tailwind CSS v4, DaisyUI v5 |
| Build | Vite 8, vite-plus |
| Testing | Vitest 3, V8 coverage |
| Component Explorer | Storybook 10 |
Getting Started
git clone https://github.com/YogliB/gitquest.git
cd gitquest
npm install
npm run dev
Open http://localhost:5173 in your browser.
Available Scripts
| Script | Description |
|---|---|
npm run dev | Start the Vite dev server |
npm run build | Production build to dist/ |
npm run preview | Preview the production build |
npm test | Run unit tests with Vitest |
npm run test:coverage | Run tests with V8 coverage (80% threshold) |
npm run knip | Detect unused exports and dependencies |
npm run jscpd | Detect duplicated code blocks |
npm run storybook | Start Storybook dev server at port 6006 |
npm run build-storybook | Build static Storybook to storybook-static/ |
How It Works
- Enter a GitHub repo URL on the landing page.
- Commits are fetched via the GitHub API (up to 100, cached for 1 hour).
- Analysis computes commit patterns: fix ratio, feature ratio, commits per day, peak hour, author count, etc.
- Music parameters (BPM, scale, voices, energy, reverb) are derived deterministically from the analysis using a seeded RNG.
- Tone.js builds the synthesis graph — melody, bass, pads, and drums — and plays it in the browser.
License
MIT