🌌 GitHub Wrapped

Your year in code, made adorable.

A Spotify Wrapped-inspired experience that turns any public GitHub profile into an animated, shareable story.

---

✨ Overview

Enter any public GitHub username and get a cinematic dashboard of coding activity, top repositories, language preferences, streaks, and a personalized developer vibe.

Built entirely on the frontend using the GitHub REST API. No backend, no database, no setup.

Try it: https://github-wrapped-xi.vercel.app/

---

📸 Preview

Profile intro	Top languages

Weekly activity	Recent work

Developer vibe card

---

🎁 Features

Category	Highlights
Profile Analytics	Profile overview, repository count, stars, forks, watchers
Coding Activity	Current and longest streaks, active days, commits by weekday
Repository Highlights	Most-starred repo, recently updated repos, language breakdown
Developer Personality	A generated archetype based on habits, languages, and activity
Visual Experience	Galaxy background, glassmorphism UI, scroll animations, 3D-style SVG pie chart, confetti
Sharing	Username-based URLs and PNG export of your Wrapped card

---

⚙️ How It Works

Username  ->  GitHub REST API (parallel requests)
                  |-- /users/{username}
                  |-- /users/{username}/repos
                  |-- /users/{username}/events/public
              ->  Aggregation  ->  Stats + Visualizations  ->  Wrapped Story
                                                                  |-- Shareable URL
                                                                  |-- PNG Export

Raw API responses are aggregated into repository counts, language distribution, stars, forks, watchers, streaks, and activity patterns, then rendered as an animated story.

---

🧰 Tech Stack

Technology	Purpose
HTML5, CSS3, JavaScript (ES6+)	Structure, styling, and application logic
GitHub REST API v3	Profile, repository, and event data
Chart.js	Activity charts
SVG	Custom 3D-style pie chart
html2canvas	PNG export
canvas-confetti	Milestone celebrations
Lucide	Icons
Google Fonts	Quicksand, Space Grotesk
Vercel	Hosting and deployment

---

🚀 Getting Started

Prerequisites: a modern browser and Git.

git clone https://github.com/yogitha-singh/github-wrapped.git
cd github-wrapped

Open index.html directly in your browser, or use a local server:

npx serve .

---

📁 Project Structure

github-wrapped/
├── index.html            # Application structure
├── style.css             # UI, animations, responsive styling
├── script.js             # API integration and application logic
├── landing.png           # Landing page preview
├── profile.png           # Profile intro preview
├── languages.png         # Top languages preview
├── activity.png          # Weekly activity preview
├── recent-work.png       # Recent work preview
├── dev-vibe.png          # Developer vibe card preview
└── README.md

---

⚠️ API Rate Limits

The app uses unauthenticated requests to the public GitHub API, so rate limits apply. Private repository data is never required.

---

🗺️ Roadmap

• Friend comparison mode
• Personal Access Token support
• Contribution heatmap
• Dark / light theme toggle
• Open Graph metadata and shareable social cards
• Improved rate-limit handling
• More developer personality types
• Year-over-year comparisons

---

🤝 Contributing

Contributions and ideas are welcome.

git checkout -b feature/your-feature
git commit -m "feat: add your feature"
git push origin feature/your-feature

Then open a pull request.

---

📌 Project Status

Active development. Functional and deployed, with new analytics and visual features added over time.

---

📄 License

Released under the MIT License.

---

💜 Created by Yogitha Singh

Built with curiosity, code, and a lot of late-night debugging.