CodeAI – AI-Powered Code Learning

CodeAI is a web platform with a Chrome extension that helps users understand, debug, and improve code using AI, track progress, and practice with challenges.

📽 Demo

Presentation Slides

View the slides

🌟 Features

1. Chrome Extension

   • Explain, fix errors, improve, and predict outputs directly from any webpage.

2. Website Dashboard

   • View your analysis, query history, courses progress, and challenges.

3. Courses & Challenges

   • Learn coding via interactive lessons and practice challenges.
   • Currently supports JavaScript challenges.

4. Community & Stack (Coming Soon)

   • Plan to add social coding features and community leaderboards.

🛠️ Tools Used

🧩 Getting Started

Follow these steps to install and run CodeAI locally.

Prerequisites

• Google Chrome
• An OpenAI API Key (Get your key here)

Installation

1. Download & Extract

   • Go to the CodeAI website
   • Download the CodeAI extension ZIP
   • Extract the ZIP folder on your computer

2. Add Your API Key

   • Open background.js inside the extracted folder
   • Find the line:

     const OPENAI_KEY = "YOUR_API_KEY_HERE";

   • Replace "YOUR_API_KEY_HERE" with your own OpenAI key

3. Load the Extension in Chrome

   • Open Chrome and go to: chrome://extensions/
   • Enable Developer Mode (top-right toggle)
   • Click Load unpacked
   • Select the extracted CodeAI folder
   • The CodeAI icon should now appear in your Chrome toolbar

💡 How to Use

Using the Extension

1. Highlight any code or text on a webpage
2. Right-click → choose the CodeAI options:
   • Explain: Understand the code
   • Error: Detect issues
   • Improve: Optimize your code
   • Output: Predict results

Using the Website

• Track your queries and course progress
• Solve coding challenges (JS only for now)
• Explore your learning roadmap

Settings

• Click the CodeAI icon in Chrome toolbar
• Choose Light/Dark theme
• Select Response Detail Level (Simple / Detailed)
• Save your settings

📜 License

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