Skip to content

Chrome extension to track LeetCode progress with friends. Get real-time stats, ranking changes, notifications when friends solve problems, and stay motivated together!

License

Notifications You must be signed in to change notification settings

anujjainbatu/leetconnect

Folders and files

NameName
Last commit message
Last commit date

Latest commit

Β 

History

27 Commits
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 

Repository files navigation

πŸ”— LeetConnect

A Chrome extension that connects you with friends and lets you track LeetCode statistics in real-time. Stay motivated by seeing your friends' progress and get notified when they solve new problems!

LeetConnect Version License

πŸ“‚ Project Structure

leetconnect/
β”œβ”€β”€ index.html                     # Landing page
β”œβ”€β”€ README.md                      # This file
β”‚
β”œβ”€β”€ leetconnect-extension/         # Chrome Extension Files
β”‚   β”œβ”€β”€ background.js              # Background service worker
β”‚   β”œβ”€β”€ manifest.json              # Extension manifest
β”‚   β”œβ”€β”€ popup.css                  # Extension UI styles
β”‚   β”œβ”€β”€ popup.html                 # Extension popup HTML
β”‚   β”œβ”€β”€ popup.js                   # Extension popup logic
β”‚   β”œβ”€β”€ assets/                    # Extension assets
β”‚   └── icons/                     # Extension icons
β”‚
β”œβ”€β”€ docs/                          # Documentation
β”œβ”€β”€ assets-landing/                # Landing page assets
└── scripts/                       # Build and deployment scripts

πŸ“Έ Demo

LeetConnect Demo GIF

πŸš€ Installation

Method 1: Install from Chrome Web Store (Coming Soon)

Extension will be published to Chrome Web Store

Method 2: Install from Source (Developer Mode)

Installation Demo

  1. Download the Extension

    git clone https://github.com/anujjainbatu/leetconnect.git
    cd leetconnect
  2. Open Chrome Extensions Page

    • Open Google Chrome
    • Navigate to chrome://extensions/
    • Or click the three dots menu β†’ More tools β†’ Extensions
  3. Enable Developer Mode

    • Toggle the "Developer mode" switch in the top-right corner
  4. Load the Extension

    • Click "Load unpacked" button
    • Select the leetconnect-extension folder (not the root folder)
    • The extension should now appear in your extensions list
  5. Pin the Extension (Optional)

    • Click the puzzle piece icon in Chrome toolbar
    • Find "LeetConnect" and click the pin icon

πŸ“– Quick Start

  1. Click the LeetConnect icon in your Chrome toolbar
  2. Enter a LeetCode username and click "Add User"
  3. Watch your friends' stats appear in real-time!
  4. Configure notifications and auto-refresh in settings

✨ Features

  • πŸ“Š Real-time Stats Tracking - View total problems solved, easy/medium/hard breakdowns, and current rankings
  • πŸ‘₯ Friend Management - Add and remove LeetCode usernames to track multiple users
  • πŸ”„ Auto-refresh - Automatically check for updates at customizable intervals
  • πŸ”” Smart Notifications - Get notified when friends solve new problems
  • πŸ“ˆ Ranking Changes - See ranking improvements/drops with visual indicators
  • 🎯 Multiple Sorting Options - Sort by rating, questions solved, or alphabetically
  • πŸ’Ύ Data Caching - Instant loading with cached data while fetching updates
  • 🎨 Beautiful Dark UI - Modern, responsive design with LeetCode-inspired colors
  • 🀝 Easy Sharing - Share the extension with friends via social media or direct links

πŸ› οΈ Development

Project Structure

  • leetconnect-extension/ - Contains all Chrome extension files
  • index.html - Landing page for the project
  • docs/ - Documentation and guides
  • assets-landing/ - Assets for the landing page
  • scripts/ - Build and deployment scripts

Building the Extension

# Navigate to extension directory
cd leetconnect-extension

# The extension is ready to load in Chrome developer mode
# No build step required for this vanilla JS extension

Package Extension for Distribution

# Create a ZIP file for Chrome Web Store
cd leetconnect-extension
zip -r ../leetconnect-extension-v1.2.2.zip . -x "*.DS_Store" "*.git*"

πŸ”§ Configuration Options

Setting Description Default
Auto Refresh Automatically check for stat updates Disabled
Refresh Interval How often to check (5min - 1hr) 15 minutes
Notifications Friend activity and daily reminders Enabled

🎯 Use Cases

  • Study Groups: Track progress of your coding study group
  • Competitive Programming: Monitor team members' contest performance
  • Workplace Teams: Keep tabs on colleagues' coding practice
  • Coding Bootcamps: Compare progress with classmates
  • Personal Motivation: See friends' activity to stay motivated

πŸ› οΈ Technical Details

Built With

  • Manifest V3 - Latest Chrome extension standard
  • Vanilla JavaScript - No external dependencies
  • Chrome Storage API - Local data persistence
  • Chrome Notifications API - Friend activity alerts
  • LeetCode API - Real-time stats fetching

Data Sources

  • Stats are fetched from: https://leetcode-api-faisalshohag.vercel.app
  • Data is cached locally for faster loading
  • No personal data is collected or transmitted

Permissions Required

  • storage - Save your friend list and settings
  • notifications - Show friend activity alerts
  • activeTab - Open LeetCode profiles
  • alarms - Schedule auto-refresh and reminders

πŸ› Troubleshooting

Extension Not Loading Stats

  1. Check if the username exists on LeetCode
  2. Ensure you have internet connection
  3. Try refreshing the extension popup

Notifications Not Working

  1. Check Chrome notification permissions
  2. Ensure notifications are enabled in extension settings
  3. Try the "Test Notification" button

Performance Issues

  1. Remove users you no longer track
  2. Increase auto-refresh interval
  3. Clear browser cache if needed

🀝 Contributing

Contributions are welcome! Here's how you can help:

  1. Fork the Repository
  2. Create a Feature Branch
    git checkout -b feature/amazing-feature
  3. Make Your Changes (Focus on files in leetconnect-extension/)
  4. Test the Extension (Load in Chrome and verify functionality)
  5. Commit Your Changes
    git commit -m 'Add some amazing feature'
  6. Push to the Branch
    git push origin feature/amazing-feature
  7. Open a Pull Request

Development Guidelines

  • Keep extension files in leetconnect-extension/ directory
  • Update documentation in docs/ when adding features
  • Test thoroughly in Chrome before submitting PR
  • Follow existing code style and patterns

πŸ’¬ Feedback & Support

We'd love to hear from you!

πŸ“ Share Your Feedback

Fill out our feedback form - Quick way to share suggestions, report bugs, or request features.

πŸ“§ Direct Contact

Email us at anujjainbatu@gmail.com for:

  • Bug reports with detailed information
  • Feature requests and suggestions
  • Technical support
  • Partnership inquiries

πŸ“ Privacy Policy

This extension:

  • βœ… Only accesses public LeetCode profile data
  • βœ… Stores data locally on your device
  • βœ… Does not collect personal information
  • βœ… Does not share data with third parties
  • βœ… Works completely offline after initial data fetch

πŸ“„ License

This project is licensed under the MIT License - see the LICENSE file for details.

πŸ™ Acknowledgments

  • LeetCode API by Faisal Shohag for providing the stats endpoint
  • LeetCode for creating an amazing platform for coding practice
  • The Chrome Extensions community for excellent documentation
  • All our users who provided valuable feedback and suggestions

⭐ If you find this extension helpful, please give it a star on GitHub! ⭐

Made with ❀️ for the coding community

πŸ› Report Bug β€’ ✨ Request Feature β€’ 🀝 Contribute β€’ πŸ“ Feedback Form

Share LeetConnect with your coding friends! πŸš€

Share on Twitter Share on LinkedIn