Loading

0%

RepoStory

Turn your GitHub repository stats into beautiful developer story cards

RoleDesignDevelopment
ToolsGithub API, NextJS
Timeline: 2 DaysType: Personal
RepoStory
01

Problem

Developers build projects, push commits, and track progress through GitHub — but the raw data tells no story by itself.

  • Commit histories are just chronological logs with no personality
  • Language stats are bare percentages with no narrative context
  • Release tags are version strings with no human meaning
  • Sharing a GitHub link forces others to interpret raw data themselves — most simply won't

The gap: there's no easy way to look at a repository and immediately understand its character — who built it, how they worked, and what kind of project it really is.

02

Solution

RepoStory transforms any public GitHub repository into a shareable visual story card in seconds.

How It Works

  • Paste a repo URL → the app fetches commit data, language distributions, and release milestones via the GitHub API
  • Assigns a developer archetype based on contributor count, age, and star metrics
  • Classifies commit habits by analysing timestamps of when commits were made
  • Optionally generates a developer narrative via Google Gemini
  • Export as PNG or copy directly to clipboard

Developer Archetypes & Commit Habits

LabelTypeSignal
Solo BuilderArchetypeSingle contributor, consistent commits
Rising StarArchetypeFast growth in stars and forks
Legacy GiantArchetypeLong-running, stable project age
Night OwlHabitMajority of commits after 10 PM
Weekend WarriorHabitMost commits on Saturday & Sunday

Tech Stack

LayerTechnologyNotes
FrameworkNext.js + custom CSSDeployed on Vercel
DataGitHub REST API60 req/hr unauth · 5,000 req/hr with token
AI LayerGemini APIOptional — enhances without blocking

03

Learnings

This project demonstrates how to build a meaningful product on top of a public API without a backend database.

Key Patterns

  • Fetch → Classify → Render: structured API data → classification logic → polished visual output
  • Archetype scoring is heuristic scoring — turning quantitative signals into qualitative labels people care about
  • Next.js + Vercel = zero infrastructure, fast iteration, live URL from day one

What to Take Away

  • Rate limit awareness is non-negotiable: always design for both unauthenticated and authenticated flows
  • Environment variable management keeps API keys safe while keeping the codebase portable
  • Making Gemini AI optional keeps the core product functional — AI enhances, but never blocks
  • The data → classify → card pattern is reusable across dozens of other product ideas

Work with me
RepoStory screenshot 2
RepoStory screenshot 3
MORE CASESTUDIESMORE CASESTUDIESMORE CASESTUDIESMORE CASESTUDIESMORE CASESTUDIESMORE CASESTUDIES