Analyze · Detect Bugs · Scan Security · Refactor — in seconds
🌐 Web App · 🔌 VS Code Extension · 🐍 Python AI Microservice · 🐳 Docker Ready
╔══════════════════════════════════════════════════════════════════════╗
║ CLIENT LAYER ║
║ ║
║ ┌──────────────────────────────┐ ┌──────────────────────────────┐ ║
║ │ 🌐 Next.js 14 Web App │ │ 🔌 VS Code Extension │ ║
║ │ TypeScript · Tailwind CSS │ │ Webview · Diagnostics │ ║
║ │ Framer Motion · Zustand │ │ CodeLens · HoverProvider │ ║
║ │ Monaco Editor │ │ CodeAction · TreeView │ ║
║ └──────────────┬───────────────┘ └──────────────┬───────────────┘ ║
╚═════════════════╪══════════════════════════════════╪════════════════╝
│ HTTPS + JWT Bearer │ HTTPS + JWT Bearer
╔═════════════════▼══════════════════════════════════▼════════════════╗
║ API GATEWAY LAYER ║
║ Next.js 14 API Routes · TypeScript ║
║ ║
║ POST /api/auth/register POST /api/auth/login ║
║ POST /api/auth/forgot-password POST /api/auth/reset-password ║
║ POST /api/review GET /api/history ║
║ DELETE /api/history/:id GET /api/stats ║
║ ║
║ ✓ Zod validation ✓ JWT auth ✓ Redis rate limiting ║
║ ✓ Security headers middleware ✓ Error boundaries ║
╚══════════════════════════════╤══════════════════════════════════════╝
│ Internal HTTP + JWT
╔══════════════════════════════▼══════════════════════════════════════╗
║ AI MICROSERVICE LAYER ║
║ Python 3.11 · FastAPI · Uvicorn ║
║ ║
║ POST /api/v1/review/analyze ║
║ GET /api/v1/review/history/:userId ║
║ DELETE /api/v1/review/history/:id ║
║ GET /health · /health/ready ║
║ ║
║ ✓ Groq LLaMA 3.3 70B ✓ Pydantic v2 ✓ Motor async MongoDB ║
║ ✓ SHA-256 Redis cache ✓ slowapi rate limiting ║
╚══════════════════════════════════════════════════════════════════════╝
│ │
┌─────────▼──────────┐ ┌──────────▼──────────┐
│ 📦 MongoDB Atlas │ │ ⚡ Redis Cloud │
│ Users · Reviews │ │ OTP · Code Cache │
└────────────────────┘ └─────────────────────┘
|
|
|
|
📦 AI-Code-Reviewer/ (repository root)
│
├── 🌐 web/ ← Next.js 14 + TypeScript [Deploy to Vercel]
│ ├── src/
│ │ ├── app/
│ │ │ ├── api/
│ │ │ │ ├── auth/
│ │ │ │ │ ├── register/route.ts POST — bcrypt + JWT
│ │ │ │ │ ├── login/route.ts POST — credential validation
│ │ │ │ │ ├── forgot-password/route.ts POST — Redis OTP + Nodemailer
│ │ │ │ │ └── reset-password/route.ts POST — OTP verify + hash
│ │ │ │ ├── review/route.ts POST — proxies to Python AI service
│ │ │ │ ├── history/
│ │ │ │ │ ├── route.ts GET — fetch user history
│ │ │ │ │ └── [id]/route.ts DELETE — remove review
│ │ │ │ └── stats/route.ts GET — aggregate stats
│ │ │ ├── globals.css Design tokens + glass UI + animations
│ │ │ ├── layout.tsx Root layout + Inter + JetBrains Mono
│ │ │ ├── page.tsx Auth gate → Dashboard
│ │ │ ├── loading.tsx Next.js loading boundary
│ │ │ └── error.tsx Next.js error boundary
│ │ ├── components/
│ │ │ ├── auth/
│ │ │ │ ├── AuthPage.tsx Split layout with branding + stats
│ │ │ │ ├── LoginForm.tsx Email + password + show/hide
│ │ │ │ ├── RegisterForm.tsx Password strength indicator
│ │ │ │ └── ResetPasswordFlow.tsx 3-step OTP flow
│ │ │ ├── dashboard/
│ │ │ │ ├── Dashboard.tsx Main layout shell
│ │ │ │ ├── Navbar.tsx Logo + user menu + extension link
│ │ │ │ ├── EditorPanel.tsx Monaco editor + status bar
│ │ │ │ ├── ResultsPanel.tsx Tabbed results + loading overlay
│ │ │ │ └── tabs/
│ │ │ │ ├── MetricsTab.tsx Score gauge + issues + suggestions + tests
│ │ │ │ ├── DiffTab.tsx Monaco DiffEditor
│ │ │ │ └── HistoryTab.tsx Review history list
│ │ │ └── ui/
│ │ │ └── CopyButton.tsx Clipboard copy with feedback
│ │ ├── lib/
│ │ │ ├── db.ts Mongoose connection (cached)
│ │ │ ├── redis.ts Redis client (singleton)
│ │ │ ├── auth.ts JWT verify helper
│ │ │ ├── rateLimit.ts Redis sliding window rate limiter
│ │ │ └── utils.ts cn · formatDate · score colors
│ │ ├── middleware.ts Security headers on all routes
│ │ ├── models/User.ts Mongoose User model (TypeScript)
│ │ ├── store/
│ │ │ ├── auth.ts Zustand auth store (persisted)
│ │ │ └── review.ts Zustand review store (persisted)
│ │ └── types/index.ts Shared TypeScript interfaces
│ ├── Dockerfile
│ ├── next.config.ts
│ ├── tailwind.config.ts
│ └── package.json
│
├── 🐍 ai-service/ ← Python FastAPI [Deploy to Railway/Render]
│ ├── main.py App factory + CORS + lifecycle hooks
│ ├── app/
│ │ ├── config.py pydantic-settings env config
│ │ ├── database.py Motor (async MongoDB) + async Redis
│ │ ├── models.py Pydantic v2 request/response schemas
│ │ ├── auth.py Internal JWT verification
│ │ ├── routers/
│ │ │ ├── review.py analyze · history · delete endpoints
│ │ │ └── health.py /health · /health/ready
│ │ └── services/
│ │ ├── ai_service.py Groq async client + structured JSON output
│ │ └── cache_service.py SHA-256 Redis cache layer
│ ├── Dockerfile
│ ├── requirements.txt
│ └── .env.example
│
├── 🔌 vscode-extension/ ← VS Code Extension TypeScript [Package as .vsix]
│ ├── src/
│ │ ├── extension.ts Activation — registers all providers & commands
│ │ ├── auth/AuthManager.ts Token storage via VS Code globalState
│ │ ├── review/ReviewManager.ts File · selection · diff · apply · copy logic
│ │ ├── diagnostics/DiagnosticsManager.ts Inline issue decorations
│ │ ├── providers/
│ │ │ ├── HoverProvider.ts Hover tooltips on issue lines
│ │ │ ├── CodeActionProvider.ts Lightbulb quick-fix actions
│ │ │ └── CodeLensProvider.ts Review lens above every file
│ │ ├── tree/HistoryTreeProvider.ts Sidebar history TreeView
│ │ ├── ui/StatusBarManager.ts Status bar item with spinner
│ │ └── panels/ReviewPanelProvider.ts Webview sidebar panel
│ ├── assets/
│ │ ├── icon-mono.svg
│ │ └── walkthrough/ Getting started guide (3 steps)
│ ├── CHANGELOG.md
│ ├── .vscodeignore
│ └── package.json
│
├── 📸 screenshots.png/ App screenshots
├── 🐳 docker-compose.yml One-command local setup (web + ai + redis)
├── 🔄 .github/workflows/ci.yml GitHub Actions CI pipeline
├── 🚫 .gitignore
└── 📖 README.md ← You are here
Option 1 — VS Code Marketplace (after publishing)
1. Open VS Code
2. Press Ctrl+Shift+X → search "CodeSense AI"
3. Click Install
Option 2 — Build & install .vsix (use this now)
# 1. Build
cd vscode-extension
npm install
npm run compile
npm run package
# → creates: codesense-ai-2.0.0.vsix
# 2. Install via CLI
code --install-extension codesense-ai-2.0.0.vsix
# OR via VS Code UI:
# Ctrl+Shift+P → "Extensions: Install from VSIX..." → select the .vsix fileOption 3 — Dev mode (F5)
cd vscode-extension
npm install && npm run compile
# Open the vscode-extension/ folder in VS Code
# Press F5 → Extension Development Host launches with extension active1. Ctrl+Shift+P → "Preferences: Open Settings (UI)"
2. Search: codesense
3. Set "CodeSense AI: Api Url" = https://your-app.vercel.app
4. Ctrl+Shift+P → "CodeSense AI: Sign In"
→ Enter your email + password
| Action | Windows / Linux | Mac |
|---|---|---|
| Review current file | Ctrl+Shift+R |
Cmd+Shift+R |
| Review selection | Ctrl+Shift+S |
Cmd+Shift+S |
| Open diff viewer | Ctrl+Shift+D |
Cmd+Shift+D |
| Copy refactored code | Ctrl+Shift+C |
Cmd+Shift+C |
| Feature | Description |
|---|---|
| ⚡ CodeLens | "Review with CodeSense AI" lens above every supported file |
| 🐛 Inline Diagnostics | Issues in editor gutter + Problems panel with severity |
| 💡 CodeAction | Lightbulb quick-fix on every diagnostic line |
| 🖱️ HoverProvider | Hover over issue line → AI details + action links |
| 🌲 TreeView | Review History panel in the activity bar sidebar |
| 🔀 Diff Viewer | Native VS Code diff: original ↔ AI refactored |
| 📋 Copy Refactored | Copy AI-optimized code to clipboard |
| ✅ Apply Refactored | Replace file content with AI version (with confirmation) |
| 💾 Persistent History | Stored in globalState — survives VS Code restarts |
| 🚶 Walkthrough | Built-in getting started guide (Help → Get Started) |
| ⚙️ Settings | API URL · auto-review on save · CodeLens toggle · max history |
javascript · typescript · javascriptreact · typescriptreact · python · java · cpp · c · go · rust · csharp
git clone https://github.com/Aakarsh2007/AI-Code-Reviewer.git
cd AI-Code-Reviewer
# Fill in your environment variables
cp web/.env.example web/.env.local
cp ai-service/.env.example ai-service/.env
# Start everything with one command
docker-compose up --build| Service | URL |
|---|---|
| 🌐 Web App | http://localhost:3000 |
| 🐍 AI Service | http://localhost:8000/docs |
| ⚡ Redis | localhost:6379 |
Step 1 — Python AI Service
cd ai-service
python -m venv .venv
source .venv/bin/activate # Windows: .venv\Scripts\activate
pip install -r requirements.txt
cp .env.example .env # Fill in your values
uvicorn main:app --reload --port 8000
# → http://localhost:8000/docs (Swagger UI)Step 2 — Next.js Web App
cd web
npm install
cp .env.example .env.local # Fill in your values
npm run dev
# → http://localhost:3000Step 3 — VS Code Extension (optional)
cd vscode-extension
npm install && npm run compile
# Press F5 in VS Code to test, or npm run package to build .vsixNEXT_PUBLIC_APP_URL=http://localhost:3000
# Database
MONGO_URI=mongodb+srv://username:password@cluster.mongodb.net/
MONGO_DB_NAME=code_reviewer
# Cache
REDIS_URI=redis://localhost:6379
# Auth — minimum 32 characters
JWT_SECRET=your_super_secret_jwt_key_minimum_32_chars
# Email (Gmail App Password — 16 chars, no spaces)
EMAIL_USER=your@gmail.com
EMAIL_PASS=abcd efgh ijkl mnop
# Python AI Service URL
AI_SERVICE_URL=http://localhost:8000GROQ_API_KEY=gsk_your_groq_api_key_here
MONGO_URI=mongodb+srv://username:password@cluster.mongodb.net/
REDIS_URI=redis://localhost:6379
JWT_SECRET=same_secret_as_web_env_above
ALLOWED_ORIGINS=["http://localhost:3000"]
DEBUG=truecd web
npx vercel --prodIn Vercel dashboard → Settings → Root Directory → set to
webThen add all env vars fromweb/.env.exampleSetAI_SERVICE_URLto your Railway/Render URL
# In Railway dashboard:
# 1. Connect this GitHub repo
# 2. Set root directory: ai-service
# 3. Add all env vars from ai-service/.env.example
# Railway auto-detects the DockerfileVS Code → Settings → Search "codesense"
→ CodeSense AI: Api Url = https://your-app.vercel.app
→ Ctrl+Shift+P → "CodeSense AI: Sign In"
✅ The extension now talks directly to your live Vercel deployment — no localhost needed.
| Layer | Implementation |
|---|---|
| 🔑 Passwords | bcrypt — cost factor 12 |
| 🎫 Sessions | JWT HS256 — 7-day expiry, Zustand persist |
| 📧 OTP Reset | Redis TTL 900s — single-use, deleted on use |
| 🛡️ Rate Limiting | Redis sliding window — 5 req / 15 min per IP |
| ✅ Input Validation | Zod (TypeScript) + Pydantic v2 (Python) |
| 🔒 Security Headers | X-Frame-Options · X-Content-Type-Options · Referrer-Policy |
| 🌐 CORS | Explicit origin allowlist in Python service |
| 📬 Email Enumeration | Forgot password always returns 200 |
| 🔐 Service Auth | Python AI service validates JWT on every request |
| 🚫 Code Execution | Code sent as string payload — never executed server-side |
User enters email
│
▼
Generate 6-digit OTP
│
├──▶ Store in Redis (TTL: 15 minutes)
│
└──▶ Send via Nodemailer (Gmail)
│
▼
User enters OTP + new password
│
▼
Validate against Redis cache
│
┌─────┴──────┐
✅ Valid ❌ Invalid / Expired
│ │
▼ ▼
Hash new password Return 400
Save to MongoDB
Delete OTP from Redis
Return 200 ✅
| Method | Endpoint | Body | Description |
|---|---|---|---|
POST |
/api/auth/register |
{email, password} |
Create account → returns JWT |
POST |
/api/auth/login |
{email, password} |
Sign in → returns JWT |
POST |
/api/auth/forgot-password |
{email} |
Send 6-digit OTP via email |
POST |
/api/auth/reset-password |
{email, otp, password} |
Validate OTP → update password |
| Method | Endpoint | Description |
|---|---|---|
POST |
/api/review |
Analyze code — rate limited 5 req / 15 min |
GET |
/api/history |
Fetch all user reviews |
DELETE |
/api/history/:id |
Delete a specific review |
GET |
/api/stats |
Aggregate stats (total · avg score · by language) |
| Method | Endpoint | Description |
|---|---|---|
POST |
/api/v1/review/analyze |
Run LLaMA 3.3 70B analysis |
GET |
/api/v1/review/history/:userId |
Get user history |
DELETE |
/api/v1/review/history/:id |
Delete review |
GET |
/health |
Health check |
| Layer | Technology |
|---|---|
| 🌐 Frontend Framework | Next.js 14 (App Router · Server Components) |
| 📝 Language | TypeScript 5.6 (strict mode throughout) |
| 🎨 Styling | Tailwind CSS 3.4 + custom design tokens |
| 🎬 Animations | Framer Motion 11 |
| 📝 Code Editor | Monaco Editor (same engine as VS Code) |
| 📦 State Management | Zustand 5 with persistence middleware |
| 🔧 Backend API | Next.js API Routes (TypeScript) |
| 🐍 AI Microservice | Python 3.11 · FastAPI · Uvicorn |
| 🤖 AI Model | Groq — LLaMA 3.3 70B Versatile |
| 🗄️ Database | MongoDB Atlas · Mongoose (TS) · Motor (Python async) |
| ⚡ Cache | Redis — OTP (15min TTL) + code cache (24h TTL) |
| 🔐 Auth | JWT HS256 · bcrypt (cost 12) |
| Nodemailer · Gmail App Password | |
| ✅ Validation | Zod (TypeScript) · Pydantic v2 (Python) |
| 🔌 VS Code | Extension API · Webview · Diagnostics · CodeLens · HoverProvider · CodeAction · TreeView |
| 🐳 DevOps | Docker · docker-compose · GitHub Actions CI |
Aakarsh Saxena
Aspiring AI Engineer & Full Stack Developer B.Tech in Information Technology · IIIT Lucknow





