🤖 AI Code Reviewer

An intelligent, full-stack automated code review tool powered by Large Language Models via OpenRouter. The application performs in-depth security, performance, and bug analysis on your source code and provides actionable feedback, quality ratings, industry best practices, and refactored code through an interactive split-view dashboard.

---

🌟 Key Features

• Multi-Stage AI Analysis Pipeline:
  • Phase 1: Deep Code Analysis — Scans specifically for security vulnerabilities, logic defects, edge cases, and performance bottlenecks.
  • Phase 2: Intelligent Refactoring — Generates clean, idiomatic, and bug-free code based on the identified issues.
  • Phase 3: Structured Report Synthesis — Consolidates insights into a consistent JSON response.
• Interactive Multi-Tab Dashboard:
  • Overview: Executive summary, rating score (1–10 stars), and key code strengths.
  • Issues: Itemized security, runtime, and algorithmic issues.
  • Improvements: Actionable recommendations for maintainability and scalability.
  • Best Practices: Industry-standard conventions and tips tailored to the code submitted.
  • Refactored Code: Ready-to-use refactored snippet with one-click clipboard copying.
• Provider Agnostic (OpenRouter): Seamlessly switch between cutting-edge models (e.g., Google Gemini 2.5 Flash, OpenAI GPT-4o, Anthropic Claude 3.5 Sonnet) via environment configuration.
• Modern Split-Screen Interface: Write or paste your code on the left and inspect reviews and optimizations in real time on the right.

---

🏗️ Architecture & Pipeline

  ┌───────────────────┐
  │   React Client    │  (Vite + React 19)
  │ (Port 5173 / dev) │
  └─────────┬─────────┘
            │  POST /api/review { code: "..." }
            ▼
  ┌───────────────────┐
  │  Express Backend  │  (Node.js + Express 5)
  │    (Port 8000)    │
  └─────────┬─────────┘
            │
            ├───► Step 1: Deep Code Analysis (Security & Bugs)
            ├───► Step 2: Code Refactoring based on Analysis
            └───► Step 3: Synthesis into Structured JSON Schema
                    │
                    ▼
           [ OpenRouter API ]
      (e.g., google/gemini-2.5-flash)

---

📁 Project Structure

ai-code-reviewer/
├── backend/                     # Express.js REST API
│   ├── controllers/             # Request handling logic
│   │   └── ai.controller.js     # Code review endpoints controller
│   ├── middleware/              # Express middlewares
│   │   └── errorHandler.js      # Global error handling middleware
│   ├── prompts/                 # LLM prompt templates
│   │   └── reviewPrompt.js      # Multi-stage prompt definitions & JSON schema
│   ├── routes/                  # API routing
│   │   └── ai.routes.js         # Routes definition (/review, /get-review)
│   ├── services/                # External services & business logic
│   │   └── openai.service.js    # OpenRouter API client & multi-stage pipeline
│   ├── .env.example             # Backend environment variables template
│   ├── package.json             # Backend dependencies & scripts
│   ├── server.js                # Express app entry point
│   └── test.http                # HTTP request tests for REST client
│
├── frontend/                    # React frontend application (Vite)
│   ├── public/                  # Static assets
│   ├── src/
│   │   ├── components/
│   │   │   ├── CodeInput.jsx    # Code editor / input panel
│   │   │   ├── Loader.jsx       # Loading animation during AI generation
│   │   │   ├── Navbar.jsx       # Header navigation bar
│   │   │   └── ReviewOutput.jsx # Tabbed review dashboard & code viewer
│   │   ├── services/
│   │   │   └── api.js           # Axios API client
│   │   ├── App.jsx              # Main workspace layout
│   │   ├── App.css              # Workspace styles
│   │   ├── index.css            # Base design system & typography
│   │   └── main.jsx             # React DOM entry point
│   ├── package.json             # Frontend dependencies & scripts
│   └── vite.config.js           # Vite configuration
│
└── README.md                    # Project documentation

---

🚀 Getting Started

Prerequisites

• Node.js (v18.0.0 or higher recommended)
• npm (v9.0.0 or higher)
• OpenRouter API Key (Obtain from openrouter.ai)

---

1. Backend Setup

1. Open your terminal and navigate to the backend directory:

   cd backend

2. Install dependencies:

   npm install

3. Configure environment variables:

   cp .env.example .env

4. Edit .env and provide your credentials:

   PORT=8000
   OPENROUTER_API_KEY=your_actual_openrouter_api_key
   MODEL=google/gemini-2.5-flash
   MAX_TOKENS=800

5. Start the backend server:

   • Development mode (with nodemon auto-restart):

     npm run dev

   • Production mode:

     npm start

   The server will start at http://localhost:8000.

---

2. Frontend Setup

1. Open another terminal tab and navigate to the frontend directory:

   cd frontend

2. Install dependencies:

   npm install

3. Start the Vite development server:

   npm run dev

4. Open your browser and navigate to the URL shown in your terminal (typically http://localhost:5173).

---

⚙️ Environment Variables

The backend requires the following configuration in backend/.env:

Variable	Description	Example / Default
PORT	Port for the Express server to listen on	8000
OPENROUTER_API_KEY	Your OpenRouter API authentication key	sk-or-v1-...
MODEL	Model slug to call via OpenRouter	google/gemini-2.5-flash
MAX_TOKENS	Maximum tokens per completion step	800

---

📡 API Reference

Health Check

GET /

Response (200 OK):

{
  "success": true,
  "message": "AI Code Reviewer API is running 🚀"
}

---

Review Code

POST /api/review

(Also accessible via POST /ai/review and POST /api/get-review)

Request Headers:

Content-Type: application/json

Request Body:

{
  "code": "function add(a, b) { return a + b; }"
}

Response (200 OK):

{
  "success": true,
  "data": {
    "review": {
      "summary": "Brief executive summary of the review.",
      "rating": 8,
      "strengths": [
        "Concise implementation",
        "Clean functional approach"
      ],
      "issues": [
        "Lacks parameter type validation"
      ],
      "improvements": [
        "Add type checking or TypeScript type annotations",
        "Include JSDoc comments"
      ],
      "bestPractices": [
        "Validate input arguments before performing arithmetic operations"
      ],
      "refactoredCode": "/**\n * Adds two numbers.\n * @param {number} a\n * @param {number} b\n * @returns {number}\n */\nfunction add(a, b) {\n  if (typeof a !== 'number' || typeof b !== 'number') {\n    throw new TypeError('Both arguments must be numbers');\n  }\n  return a + b;\n}"
    }
  },
  "review": { ... }
}

---

🛠️ Tech Stack

Frontend

• Framework: React 19
• Build Tool: Vite
• HTTP Client: Axios
• Markdown Rendering: React Markdown
• Styling: Vanilla CSS (Modular design system with CSS custom properties)

Backend

• Runtime: Node.js (ES Modules)
• Framework: Express 5
• AI Integration: OpenRouter API
• Dev Tools: Nodemon

---

🧪 Testing the API Locally

You can test the backend API using the included backend/test.http file with the VS Code / Cursor REST Client extension or using curl:

curl -X POST http://localhost:8000/api/review \
  -H "Content-Type: application/json" \
  -d '{"code": "function divide(a, b) { return a / b; }"}'

---

🤝 Contributing

Contributions, issues, and feature requests are welcome!

1. Fork the repository
2. Create your feature branch (git checkout -b feature/AmazingFeature)
3. Commit your changes (git commit -m 'Add some AmazingFeature')
4. Push to the branch (git push origin feature/AmazingFeature)
5. Open a Pull Request

---

📄 License

This project is licensed under the ISC License.