Skip to content

An AI-powered Chrome extension that provides progressive hints for Data Structures & Algorithms problems. Helps students learn problem-solving skills through intelligent guidance without giving away complete solutions. Features auto-detection for LeetCode/GeeksforGeeks, side panel interface, and Gemini 1.5 Flash API integration.

Notifications You must be signed in to change notification settings

vikky2810/DSA_Chrome-Extenstion

Folders and files

NameName
Last commit message
Last commit date

Latest commit

ย 

History

1 Commit
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 

Repository files navigation

๐Ÿง  DSA Hints Coach - Chrome Extension

An AI-powered Chrome extension that provides progressive hints for Data Structures & Algorithms problems, helping students learn problem-solving skills without giving away complete solutions.

โœจ Features

  • Progressive Hints: Get 3 levels of hints (General Direction โ†’ Data Structure/Algorithm โ†’ Optimization/Edge Cases)
  • Side Panel Interface: Clean, modern UI that stays open while solving problems
  • Auto-Detection: Automatically detects DSA problems from LeetCode and GeeksforGeeks
  • Manual Input: Paste problem statements manually for any DSA problem
  • History Tracking: Save and revisit previous queries
  • Gemini 1.5 Flash API: Powered by Google's latest AI model for intelligent hint generation

๐Ÿš€ Installation

Prerequisites

Steps

  1. Download/Clone this repository to your local machine

  2. Get API Key:

  3. Load Extension:

    • Open Chrome and go to chrome://extensions/
    • Enable "Developer mode" (toggle in top right)
    • Click "Load unpacked"
    • Select the extension folder
  4. Set API Key:

    • Click the extension icon or open the side panel
    • Enter your Gemini API key when prompted
    • Click "Save & Test API Key"
    • The extension will test and save your key securely

For detailed API setup instructions, see API_SETUP.md

๐Ÿ“ Project Structure

dsa-hints-extension/
โ”‚โ”€โ”€ manifest.json          # Extension configuration
โ”‚โ”€โ”€ sidepanel.html         # Main UI interface
โ”‚โ”€โ”€ sidepanel.css          # Styling and animations
โ”‚โ”€โ”€ sidepanel.js           # Main functionality and UI logic
โ”‚โ”€โ”€ config.js              # Configuration and API key management
โ”‚โ”€โ”€ api-service.js         # Gemini API service with error handling
โ”‚โ”€โ”€ background.js          # Service worker for background tasks
โ”‚โ”€โ”€ content.js             # Content script for problem detection
โ”‚โ”€โ”€ utils/
โ”‚     โ””โ”€โ”€ prompt.js        # AI prompt templates and utilities
โ”‚โ”€โ”€ icons/                 # Extension icons (16x16, 48x48, 128x128)
โ”‚โ”€โ”€ .env                   # Environment variables (create this file)
โ”‚โ”€โ”€ .gitignore            # Git ignore rules
โ”‚โ”€โ”€ API_SETUP.md          # Detailed API setup guide
โ””โ”€โ”€ README.md             # This file

๐ŸŽฏ Usage

Opening the Extension

  • Method 1: Click the extension icon in the toolbar
  • Method 2: Right-click on any page โ†’ "Open DSA Hints Coach"
  • Method 3: Use keyboard shortcut (if configured)

Getting Hints

  1. Auto-Detection: Visit LeetCode or GeeksforGeeks problem pages
  2. Manual Input: Paste any DSA problem statement in the textarea
  3. Click "Get Hint": Receive 3 progressive hints
  4. Review History: Click on previous queries to reload them

Supported Websites

  • LeetCode: leetcode.com/problems/*
  • GeeksforGeeks: geeksforgeeks.org/problems/* and geeksforgeeks.org/practice/*

๐Ÿ”ง Configuration

API Settings

The extension uses Gemini 1.5 Flash API with the following configuration:

  • Temperature: 0.7 (balanced creativity and consistency)
  • Max Tokens: 800 (sufficient for detailed hints)
  • Model: gemini-1.5-flash (latest and fastest)

Storage

  • API Key: Stored securely in Chrome sync storage
  • Query History: Last 10 queries stored locally
  • Detected Problems: Automatically cached for quick access

๐ŸŽจ Customization

Styling

  • Modify sidepanel.css to change colors, fonts, and layout
  • The extension uses CSS custom properties for easy theming
  • Responsive design included for different screen sizes

Prompts

  • Edit utils/prompt.js to customize AI behavior
  • Modify hint categories and generation rules
  • Add new prompt templates for different problem types

๐Ÿ› Troubleshooting

Common Issues

  1. "Failed to generate hints" Error

    • Check if your API key is valid and properly saved
    • The extension will test your API key when you save it
    • Verify you haven't exceeded API usage limits
    • Check your internet connection
  2. "Invalid API key" Error

    • Ensure you've entered the correct Gemini API key
    • Check that the key has proper permissions
    • Try regenerating the key from Google AI Studio
    • Make sure the key starts with "AIza..."
  3. "Rate limit exceeded" Error

    • You've hit the API usage limit (15 requests per minute)
    • Wait a minute and try again
    • Consider upgrading your API quota if needed
  4. "Network error" Error

    • Check your internet connection
    • Try refreshing the page
    • Check if Google's servers are accessible
  5. Side Panel Not Opening

    • Check if the extension is properly loaded
    • Try refreshing the page
    • Ensure Chrome version supports side panels (88+)
  6. Problem Detection Not Working

    • Verify you're on a supported website (LeetCode, GeeksforGeeks)
    • Check if content scripts are enabled
    • Try refreshing the page

Debug Mode

  • Open Chrome DevTools
  • Check the Console tab for error messages
  • Look for messages from "DSA Hints Coach"

๐Ÿ”ฎ Future Enhancements

  • Gamification: Track hint usage and provide achievements
  • Problem Categories: Organize problems by difficulty and topic
  • Custom Hints: Allow users to create and share hint sets
  • Code Analysis: Analyze user code and provide specific feedback
  • Learning Paths: Suggest related problems and concepts
  • Offline Mode: Cache hints for offline access

๐Ÿค Contributing

  1. Fork the repository
  2. Create a feature branch
  3. Make your changes
  4. Test thoroughly
  5. Submit a pull request

๐Ÿ“ License

This project is open source and available under the MIT License.

๐Ÿ™ Acknowledgments

  • Google AI Studio for providing the Gemini API
  • Chrome Extensions Team for the side panel API
  • DSA Community for inspiration and feedback

๐Ÿ“ž Support

If you encounter any issues or have suggestions:

  • Open an issue on GitHub
  • Check the troubleshooting section above
  • Ensure you're using the latest version

Happy Coding! ๐Ÿš€

Remember: The goal is to learn, not just to solve. Use hints wisely and understand the concepts behind each approach.

About

An AI-powered Chrome extension that provides progressive hints for Data Structures & Algorithms problems. Helps students learn problem-solving skills through intelligent guidance without giving away complete solutions. Features auto-detection for LeetCode/GeeksforGeeks, side panel interface, and Gemini 1.5 Flash API integration.

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published