Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/vansh-codes/leetcode-tracker
Personalize leetcode tracker to track my leetcode progress effectively
https://github.com/vansh-codes/leetcode-tracker
github-api leetcode leetcode-progress leetcode-tracker nextjs problem-solving progress-monitoring
Last synced: about 2 months ago
JSON representation
Personalize leetcode tracker to track my leetcode progress effectively
- Host: GitHub
- URL: https://github.com/vansh-codes/leetcode-tracker
- Owner: vansh-codes
- Created: 2024-10-28T17:29:14.000Z (3 months ago)
- Default Branch: master
- Last Pushed: 2024-10-28T18:24:16.000Z (3 months ago)
- Last Synced: 2024-10-28T19:34:01.253Z (3 months ago)
- Topics: github-api, leetcode, leetcode-progress, leetcode-tracker, nextjs, problem-solving, progress-monitoring
- Language: JavaScript
- Homepage: https://leetcode-heatmap.vercel.app/
- Size: 272 KB
- Stars: 1
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# 🌟 LeetCode Heatmap 🌟
Welcome to the **LeetCode Heatmap**! This project provides a visual representation of your coding progress on LeetCode through a heatmap. Click on any day's box to see the problems solved and commits made on that day.
## 📖 Table of Contents
- [🌟 LeetCode Heatmap 🌟](#-leetcode-heatmap-)
- [📖 Table of Contents](#-table-of-contents)
- [💡 Features](#-features)
- [🔧 Installation](#-installation)
- [🛠️ Environment Variables](#️-environment-variables)
- [🚀 Usage](#-usage)
- [🔗 Deployment](#-deployment)
- [🔍 Acknowledgments](#-acknowledgments)
- [📞 Contact](#-contact)
## 💡 Features
- Interactive heatmap visualizing daily coding activity 🗓️
- Tooltip information on each day's activity 📊
- Responsive design for seamless usage on all devices 📱💻
- Dynamic rendering of problems solved and commits made 💪
## 🔧 Installation
To get started with the LeetCode Heatmap project, follow these steps:
1. Clone the repository:
```bash
git clone https://github.com/vansh-codes/LeetCode-Tracker.git
```
2. Navigate to the project directory:
```bash
cd LeetCode-Tracker
```
3. Install the required dependencies:
```bash
npm install
```
4. Start the development server:
```bash
npm run dev
```
Now open [http://localhost:3000](http://localhost:3000) in your browser to view the application!
## 🛠️ Environment Variables
Before running the application, you need to set up environment variables to access the GitHub API. Create a `.env.local` file in the root of your project and add the following lines:
```
GITHUB_TOKEN=your_personal_access_github_token
NEXT_PUBLIC_GITHUB_USERNAME=your_github_username
NEXT_PUBLIC_GITHUB_REPO=your_repo_name
```
## 🚀 Usage
- Click on any box in the heatmap to view the problems solved on that day.
- Use the dropdown to filter by year for a more tailored experience.
## 🔗 Deployment
Check out the live application here: [LeetCode Heatmap](https://leetcode-heatmap.vercel.app/) 🌐
## 🔍 Acknowledgments
A special thanks to the following libraries that made this project possible:
- [react-activity-calendar](https://github.com/grubersjoe/react-activity-calendar): For the beautiful heatmap component 🌈
- [react-tooltip](https://github.com/wwayne/react-tooltip): For providing elegant tooltips on hover 💬
- [framer-motion](https://www.framer.com/motion/): For stunning animations that enhance user experience 🎨
- [lucide-react](https://lucide.dev/): For beautiful icons that add visual appeal 🔍
## 📞 Contact
For any inquiries or suggestions, feel free to reach out to me:
- [GitHub](https://github.com/vansh-codes)
- [LinkedIn](https://www.linkedin.com/in/vanshchaurasiya24/)
Thank you for checking out the LeetCode Heatmap! Happy coding! 🚀