GitHub Recapper 🚀

Your Year in Code, Visualized.
Think "Spotify Wrapped", but for your GitHub activity.

📖 Overview

GitHub Recapper breaks down your coding year into a cinematic story. It analyzes your repositories, commits, languages, and stars to spot trends and celebrate your achievements as a developer.

Whether you code daily or just on weekends, see your impact in a fresh, beautiful way.

✨ Features

• 🎬 Story Mode: A "Spotify Wrapped"-style slideshow featuring your top languages, biggest projects, and activity stats.
• 📊 Interactive Dashboard: Explore detailed metrics including specialized commit patterns and repository insights.
• 📅 Time Travel: Select any year (2020-Current) to see your past achievements.
• 🎨 Share Center: Generate beautiful, custom images (Card, Glitch, or Minimal styles) to share on social media.
• 🔒 Privacy First: Data is fetched client-side. Your personal access tokens remain in your browser's memory and are never stored on a server.

🛠 Tech Stack

• Core: React, TypeScript, Vite
• Styling: Tailwind CSS, Framer Motion (for animations)
• Data: GitHub REST API (Octokit)
• Utilities: html-to-image (for sharing), Recharts (for data viz)

🚀 Getting Started

Prerequisites

• Node.js (v16 or higher)
• A GitHub account

Installation

1. Clone the repository:

   git clone https://github.com/yourusername/github-recapper.git
   cd github-recapper

2. Install dependencies:

   npm install

3. Run the development server:

   npm run dev

4. Open the app: Visit http://localhost:5173 in your browser.

🔑 Authentication

To analyze your data, you need to log in. You have two options:

1. OAuth (Recommended for Production): Requires setting up a GitHub OAuth App (see Deployment).
2. Personal Access Token (Local Dev): Click "Enter Personal Access Token" on the landing page.
   • Generate a token here.
   • Required scopes: repo, read:user.

📦 Deployment

Deploy easily to Vercel:

1. Push your code to a GitHub repository.
2. Import the project into Vercel.
3. Set up the Environment Variables in Vercel:
   • GITHUB_CLIENT_ID
   • GITHUB_CLIENT_SECRET (Get these by registering a new OAuth App in GitHub Developer Settings).
4. Update your GitHub OAuth App's "Authorization callback URL" to https://your-app.vercel.app/api/callback.

🤝 Contributing

Contributions are welcome! Please feel free to submit a Pull Request.

1. Fork the project
2. Create your Feature Branch (git checkout -b feature/AmazingFeature)
3. Commit your Changes (git commit -m 'Add some AmazingFeature')
4. Push to the Branch (git push origin feature/AmazingFeature)
5. Open a Pull Request

📄 License

Distributed under the MIT License. See LICENSE for more information.

---

Built with ❤️ for developers.