Roast My GitHub

Landing page
Dashboard-overview page
repos section
commits section
languages section
socials section
shareable card

Inspiration

GitHub profiles tell stories—3 AM commits, abandoned repos, "fix fix fix" messages. We wanted to turn that chaos into comedy. Roast My GitHub is Spotify Wrapped meets roast comedy for developers.

What it does

Analyzes any GitHub profile and generates AI-powered roasts:

Overview: Profile summary in savage sentences
Repos: Individual roasts for top projects + abandoned repo graveyard
Commits: Exposes your 3 AM coding habits and commit message quality
Languages: Roasts your tech stack choices
Social: Judges follower ratios and bio
Share: Download beautiful, customizable roast cards

Every roast references your actual data—repo names, real stats, specific patterns.

How we built it

Stack: React + Vite, Tailwind CSS, shadcn/ui, Framer Motion, Gemini AI, GitHub API

Key Features:

Parallel API calls (GitHub + Gemini) → sub-3-second loads
Terminal-style loading with personality
Smooth 60fps animations throughout
Mobile-responsive with swipe gestures
Shareable cards with html2canvas

Design: Developer brutalist aesthetic—solid colors (#0a0a0a + #00ff88), no gradients, monospace fonts, clean animations.

Challenges

GitHub Rate Limits → Request batching + caching + authenticated API
AI Consistency → Refined prompts with word limits + JSON schema + examples
Animation Performance → Lazy loading + React.memo + reduced motion support
Mobile UX → Horizontal scroll tabs + touch-friendly targets + responsive charts

Accomplishments

✨ Every interaction feels intentional (terminal loading, staggered animations, micro-interactions)
🎨 Unique developer aesthetic that stands out
🤖 Smart AI roasts that reference actual data, not templates
⚡ Fast performance despite dual API calls
📱 Works beautifully on mobile
♿ Fully accessible (keyboard nav, ARIA labels)