Visualize your GitHub programming language statistics with beautiful interactive charts
latest-demo.mp4
Access the demo here
| Feature | Description | |
|---|---|---|
| π | Username Search | Search any public GitHub user or organization by username and instantly visualize their programming language distribution. |
| π’ | Private GitHub Enterprise (GHE) | Works with any self-hosted GHE instance β GitLingo auto-derives the profile details and language distribution from the API. (See here for details on setup) |
| π | Three Interactive Chart Types | Switch between Bar, Pie, and Polar Area charts in one click without re-triggering the API or losing your filter state. |
| π― | Top-N Language Aggregation | Slice results to Top 10, Top 25, or all detected languages, with overflow automatically folded into a unified "Others" slice. |
| π§ | Fork & Unknown Language Filtering | Toggle forked repos and repositories with no detected language independently, isolating only the signal that matters. |
| π | KPI Dashboard | Four at-a-glance cards β total repositories, top language, unique language count, and language coverage percentage. |
| π | Most Searched Leaderboard | A live community top-9 of the most-searched users or organizations, displayed as clickable one-tap chips on the home screen. |
| π₯ | PNG & CSV Export | Download the active chart as a timestamped PNG or export the raw language breakdown as a standards-compliant CSV file. |
| π | Shareable Deep Links | Every search produces a bookmarkable URL (e.g. /github/octocat) that auto-executes the search on load. |
| β‘ | Server-Side Caching with Freshness Indicator | Responses are cached server-side and the UI shows a live chip counting down exactly when the data will next refresh. |
- Runtime: Node.js 24+ with TypeScript 5
- Framework: Express.js v5
- Database: SQLite via better-sqlite3
- API Client: @octokit/graphql (GitHub GraphQL API v4)
- Validation: Zod v4
- Framework: React 19 with TypeScript 5
- Build Tool: Vite 7
- State Management: TanStack Query v5
- Charts: Chart.js v4 with react-chartjs-2
- Styling: Tailwind CSS v3
- Node.js: v24 or higher β or Bun: v1.3.9 or higher
- GitHub Token: Personal access token with
read:org, read:user, user:emailscopes
-
Clone the repository
git clone https://github.com/wildan3105/GitLingo.git cd GitLingo -
Install backend dependencies
cd backend npm install # or: bun install
-
Install frontend dependencies
cd ../frontend npm install # or: bun install
-
Configure environment variables
Backend (
backend/.env):PORT=3001 NODE_ENV=development GITHUB_TOKEN=your_github_personal_access_token ALLOWED_ORIGINS=http://localhost:5173 ENABLE_CACHE=true CACHE_TTL_HOURS=12
Frontend (
frontend/.env):VITE_API_BASE_URL=http://localhost:3001
You need to run both servers simultaneously:
Terminal 1 - Backend:
cd backend
npm run dev # or: bun run devBackend runs on http://localhost:3001
Terminal 2 - Frontend:
cd frontend
npm run dev # or: bun run devFrontend runs on http://localhost:5173
Backend Tests:
cd backend
npm test # Run all tests
npm run test:watch # Watch mode
npm run test:coverage # Coverage reportFrontend Tests:
cd frontend
npm test # Run all tests in watch mode
npm run test:coverage # Coverage reportPlease see CONTRIBUTING.md for guidelines on how to contribute to this project.
- github-readme-stats - A popular project that generates GitHub stats as images for README files.
- github-user-language-breakdown - A project that provides a breakdown of a GitHub user's languages in a simple format (but looks like the app is no longer maintained and has some issues with the GitHub API).
- github-profile-languages - A project that visualizes the programming languages used in a GitHub profile.
- metrics - A project that provides insights into GitHub repositories and user activity via GitHub Actions and generates a profile README.
MIT License - see LICENSE file for details
