GitShow
March 7, 2026 · View on GitHub
Your GitHub profile, but way better. Auto-generated developer portfolio with npm downloads, smart categories, tech stack, and OG social cards.
github.com/username → gitshow.dev/username
Replace github.com with gitshow.dev in any profile URL. No signup, no config, no deploy.
Inspired by GitMCP — same URL-swap pattern, but for developer portfolios instead of AI context.
See It In Action
What GitHub Doesn't Show (But GitShow Does)
| Feature | What you see |
|---|---|
| npm downloads | Total downloads/month across all your packages, with per-package bar chart |
| Smart categories | Repos auto-grouped: MCP Servers, CLI Tools, React & UI, DevOps, i18n... |
| OS contributions | Commits and PRs to other people's repos — what you give back to open source |
| Focus areas | Aggregated topic cloud showing what you specialize in |
| Project timeline | When you shipped projects — your creation velocity |
| Tech stack bar | Visual language breakdown across all repos |
| Aggregate stats | Projects, stars, forks, followers, npm downloads — one glanceable row |
| OG social card | Dynamic 1200×630 image with stats and categories — looks great when shared |
| Share buttons | One-click share to X, LinkedIn, or copy link |
Forks and archived repos are automatically filtered out. Only your original work is shown.
The contributions section uses GitHub's GraphQL API to pull the last 12 months of activity. If a user contributes more to external projects than they have of their own, contributions are promoted to the top of the page.
URL Patterns
All of these work:
gitshow.dev/username # direct
gitshow.dev/?url=https://github.com/username # query param
gitshow.dev/?https://github.com/username # bare prefix
README Badge
Want your own? Add a dynamic profile card to any GitHub README — one line of markdown.
Setup
Replace YOUR_USERNAME with your GitHub username:
[](https://gitshow.dev/YOUR_USERNAME)
The card is a dynamic PNG that pulls your live GitHub stats (repos, stars, npm downloads). It updates automatically every hour via ISR caching. No tokens, no setup — just paste and go.
Architecture
Browser request
↓
Next.js App Router (Vercel Edge)
↓
GitHub REST API (/users, /repos) + GraphQL API (contributions) + npm Registry
↓
Auto-categorize repos + fetch OS contributions + npm stats
↓
Server-rendered portfolio page
↓
ISR cache (1 hour TTL)
| Component | Role |
|---|---|
| Next.js 16 | App Router, Server Components, ISR |
| React 19 | Zero client JS on portfolio pages (except share/expand) |
| Tailwind CSS 4 | Dark theme, responsive layout |
| Vercel OG | Dynamic social preview image generation (Satori) |
| GitHub REST API | Profile + repos data, cached with revalidate: 3600 |
| GitHub GraphQL API | Open source contributions (last 12 months) |
| npm Registry | Package search + download counts per maintainer |
GEO & LLM Readiness
GitShow is optimized for both traditional search engines and AI-powered search (ChatGPT, Perplexity, Claude, Gemini):
| Signal | Implementation |
|---|---|
llms.txt | Structured context file at /llms.txt for LLM inference |
| AI crawler access | robots.txt explicitly allows GPTBot, ClaudeBot, PerplexityBot, Google-Extended |
| Schema.org JSON-LD | SoftwareApplication with featureList, FAQPage, ProfilePage, Person, BreadcrumbList |
| OpenGraph + Twitter | Dynamic per-profile OG images and meta descriptions |
| SSR | All content server-rendered — no JS required for AI crawlers |
| Canonical URLs | Every profile has a canonical https://gitshow.dev/{username} |
| Sitemap | Auto-generated with featured profiles |
Deploy Your Own
One-click Vercel deploy
Or clone and run locally
git clone https://github.com/ofershap/gitshow.git
cd gitshow
npm install
npm run dev # → http://localhost:3000
Environment Variables
| Variable | Required | Description |
|---|---|---|
GITHUB_TOKEN | No | GitHub PAT for higher rate limits (60/hr → 5,000/hr) |
Tip: Without a token, the GitHub API allows 60 requests/hour per IP. If you're deploying publicly, add a token to avoid rate limiting.
Project Structure
public/
├── llms.txt # LLM context file for AI search engines
src/
├── app/
│ ├── page.tsx # Landing page — URL swap animation, search
│ ├── layout.tsx # Root layout — dark theme, fonts
│ ├── robots.ts # Robots config with AI crawler rules
│ ├── sitemap.ts # Auto-generated sitemap
│ ├── [username]/
│ │ ├── page.tsx # Portfolio page (SSR + ISR)
│ │ ├── loading.tsx # Spinner while loading
│ │ ├── error.tsx # Error boundary (rate limit, etc.)
│ │ └── not-found.tsx # 404 for invalid usernames
│ └── api/
│ ├── og/[username]/
│ │ └── route.tsx # OG social card (1200×630 PNG)
│ └── card/[username]/
│ └── route.tsx # README badge (920×112 PNG, 2x retina)
├── components/
│ ├── hero-card.tsx # Avatar, name, bio, aggregate stats + npm
│ ├── category-section.tsx # Auto-grouped repos with expand/collapse
│ ├── contributions-card.tsx # OS contributions with smart positioning
│ ├── npm-card.tsx # npm download stats with bar chart
│ ├── tech-stack.tsx # Language breakdown bar + legend
│ ├── topic-cloud.tsx # Weighted focus areas cloud
│ ├── activity-graph.tsx # Project creation timeline
│ ├── share-bar.tsx # Share to X, LinkedIn, copy link
│ ├── social-links.tsx # GitHub, Twitter, LinkedIn, website
│ ├── json-ld.tsx # Schema.org structured data (FAQ, App, Profile)
│ ├── url-swap.tsx # Animated URL swap (landing page)
│ ├── username-input.tsx # Search input (landing page)
│ └── footer.tsx # Attribution
├── lib/
│ ├── github.ts # GitHub REST + GraphQL API client
│ ├── npm.ts # npm registry API client
│ ├── categorize.ts # Smart repo categorization engine
│ ├── types.ts # TypeScript interfaces
│ └── utils.ts # formatNumber, timeAgo, getTopRepos
└── proxy.ts # URL redirect handler
Development
npm run dev # Dev server → localhost:3000
npm run build # Production build
npm run lint # ESLint
Author
README built with README Builder
License
MIT © Ofer Shapira