Pls check loom link below to see video demo!!

Inspiration

Every developer has a GitHub repo they've quietly abandoned — last commit message: "quick fix", README still says "Getting Started", .env somehow committed (with API keys...). The Tamagotchi's core mechanic is guilt through neglect, and a developer's repo is the perfect host organism for that feeling, so we reimagined the classic toy as a virtual pet that lives directly in your README and judges you for your commit history.

What it does

TamaGHotchi turns any public GitHub repository into a Tamagotchi-style virtual pet embedded directly in the README - one line of Markdown, no login required for viewers. The pet's emotional state is computed live from real repo data: days since last commit, commit message quality, hygiene signals like committed .env files or node_modules/, and late-night coding patterns - then rendered as a PNG badge that GitHub displays inline, refreshing every 5 minutes.

How we built it

The badge endpoint runs on Next.js 14 App Router at the edge, using @vercel/og (Satori) to render JSX directly to PNG - sprites had to be self-contained inline JSX since Satori can't load external images reliably. The stat engine computes four vitals from raw GitHub REST API calls (no database — every request is computed fresh), maps them through a priority-ordered state function, and returns the result with Cache-Control: max-age=300 so GitHub CDN caches it without serving stale tombstones forever.

Challenges we ran into

GitHub's README rendering pipeline aggressively strips non-allowlisted headers, so getting cache invalidation right required careful tuning of Cache-Control and stale-while-revalidate to balance freshness against GitHub's own CDN layer caching the badge image upstream of us. Satori's edge rendering constraints were also a wall - no external image loading, limited CSS support, and a font pipeline that had to be carefully bundled, which meant every pet sprite had to be hand-crafted as inline JSX pixel art rather than simply loading a PNG.

Accomplishments that we're proud of

The badge works for any public repo with zero setup - no account, no webhook, no configuration, just paste one line of Markdown and your repo has a living pet in 30 seconds. We're also proud that the shame feed is genuinely funny in a specific way: it references your actual commit messages, your actual filenames, your actual 2am push, which makes it feel less like a tool and more like something that knows you.

What we learned

We learned that edge rendering has sharp, non-obvious constraints — what works in a normal Next.js route silently breaks at the edge, and debugging Satori's JSX-to-PNG pipeline taught us exactly where the boundary between "supported CSS" and "quietly ignored CSS" lies. We also learned that the funniest features are the ones built on data people already have: there's no proprietary metric here, just GitHub's own API read sideways.

What's next for TamaGHotchi

The next major feature is an interactive 3D version of the pet using Three.js - a fully animated character you can actually interact with in the setup dashboard, replacing the flat sprite with something that reacts to your repo stats in real time. On the data side, we want to add webhook-driven instant cache invalidation so the badge updates the moment you push, and expand the stat engine to catch more flavors of developer shame.

Built With

  • anthropic
  • api
  • claude
  • github-oauth
  • github-rest-api
  • next.js-14
  • nextauth.js
  • octokit
  • tailwind-css
  • typescript
  • vercel
  • vercel-og-(satori)
  • web-audio-api
Share this project:

Updates