An intelligent, full-stack automated code review workspace powered by Large Language Models via OpenRouter. The application performs in-depth security, performance, and bug analysis on source code across multiple programming languages and delivers structured feedback, ratings, industry best practices, and refactored code through an interactive split-view dashboard.
All project workflows have been verified and tested end-to-end:
| Workflow | Scope | Status | Notes |
|---|---|---|---|
| Frontend Linting | frontend |
PASSED |
ESLint 10 verification clean across all JSX components |
| Frontend Build | frontend |
PASSED |
Vite 8 production build bundles clean assets to dist/ |
| Backend API Server | backend |
PASSED |
Express 5 REST API running on port 8000 (supports /api and /ai routes) |
| 3-Stage LLM Pipeline | backend/services |
PASSED |
Multi-stage analysis, refactoring, and JSON report synthesis verified with live OpenRouter model (google/gemini-2.5-flash) |
- 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, type-safe, and bug-free code based on Phase 1 findings.
- Phase 3: Structured Report Synthesis — Formats insights into a reliable JSON schema for seamless UI rendering.
- Interactive Tabbed Review Dashboard:
- Overview: Executive summary, rating score (1–10 stars), and key code strengths.
- Issues: Itemized security flaws, runtime risks, and algorithmic issues.
- Improvements: Actionable recommendations for code maintainability, type safety, and scalability.
- Best Practices: Industry-standard engineering tips tailored to the submitted code.
- Refactored Code: Ready-to-use refactored code snippet with one-click clipboard copying.
- Multi-Language Support: Editor selector with preset support for JavaScript, TypeScript, Python, and Java.
- Provider Agnostic (OpenRouter): Easily switch between LLM models (e.g., Google Gemini 2.5 Flash, OpenAI GPT-4o, Anthropic Claude 3.5 Sonnet) via environment variable configuration.
- Modern Split-Screen Interface: Code editor panel on the left with live character counters, real-time loading feedback with skeleton cards, and formatted AI review panel on the right.
┌────────────────────────┐
│ React 19 Frontend │ (Vite 8 Dev Server @ http://localhost:5173)
│ (Source Code Editor) │
└───────────┬────────────┘
│ POST /api/review { "code": "..." }
▼
┌────────────────────────┐
│ Express 5 Backend │ (Node.js REST Server @ http://localhost:8000)
│ (Controller & Router) │
└───────────┬────────────┘
│
├───► Step 1: Deep Code Analysis (Security & Bugs)
├───► Step 2: Code Refactoring based on Analysis Findings
└───► Step 3: Report Synthesis into Structured JSON Schema
│
▼
[ OpenRouter API ]
(e.g., google/gemini-2.5-flash)
ai-code-reviewer/
├── backend/ # Express.js REST API Backend
│ ├── controllers/ # Endpoint controllers
│ │ └── ai.controller.js # Express request handler for code reviews
│ ├── middleware/ # Express middlewares
│ │ └── errorHandler.js # Global error and OpenRouter response handler
│ ├── prompts/ # Prompt engineering templates
│ │ └── reviewPrompt.js # 3-stage prompts & JSON output schema definition
│ ├── routes/ # API routing definitions
│ │ └── ai.routes.js # Express router for /review and /get-review
│ ├── services/ # Business logic & LLM service integration
│ │ └── openai.service.js # OpenRouter API client & 3-stage execution pipeline
│ ├── .env.example # Backend environment template
│ ├── .env # Local environment file (API keys & port config)
│ ├── package.json # Backend dependencies & npm scripts
│ ├── server.js # Express app entry point
│ └── test.http # REST Client test request collection
│
├── frontend/ # React 19 Frontend Application (Vite 8)
│ ├── public/ # Favicons and SVG assets
│ ├── src/
│ │ ├── components/
│ │ │ ├── CodeInput.jsx # Split-screen code editor input component
│ │ │ ├── Loader.jsx # Animated loading state with skeleton UI
│ │ │ ├── Navbar.jsx # Header bar & branding component
│ │ │ └── ReviewOutput.jsx # Tabbed review dashboard & refactored code view
│ │ ├── services/
│ │ │ └── api.js # Axios API client pointing to backend
│ │ ├── App.jsx # Workspace layout manager
│ │ ├── App.css # Dashboard and component styling
│ │ ├── index.css # Base design system tokens and typography
│ │ └── main.jsx # React DOM root render
│ ├── eslint.config.js # ESLint 10 flat configuration
│ ├── package.json # Frontend dependencies & npm scripts
│ └── vite.config.js # Vite 8 project configuration
│
└── README.md # System documentation & project overview
- Framework: React 19
- Build Tool: Vite 8
- HTTP Client: Axios
- Linting: ESLint 10
- Styling: Modern CSS variables & responsive split-grid layout system
- Runtime: Node.js (ES Modules)
- Framework: Express 5
- AI Integration: OpenRouter API (Axios HTTP client)
- Environment Handling: dotenv
- Development Monitor: Nodemon
- Node.js (
>= v18.0.0) - npm (
>= v9.0.0) - OpenRouter API Key (Obtain from openrouter.ai)
-
Open your terminal and navigate to the
backenddirectory:cd backend -
Install dependencies:
npm install
-
Configure environment variables: Create a
.envfile inbackend/(or copy.env.example):PORT=8000 OPENROUTER_API_KEY=your_actual_openrouter_api_key MODEL=google/gemini-2.5-flash MAX_TOKENS=800
-
Run the backend server:
- Development mode (with auto-restart via nodemon):
npm run dev
- Production mode:
npm start
The backend API will start on
http://localhost:8000. - Development mode (with auto-restart via nodemon):
-
Open a second terminal window and navigate to the
frontenddirectory:cd frontend -
Install dependencies:
npm install
-
Run linting and build checks:
npm run lint npm run build
-
Start the Vite development server:
npm run dev
-
Open your browser and navigate to
http://localhost:5173.
The backend requires the following keys in backend/.env:
| Variable | Description | Default / Recommended |
|---|---|---|
PORT |
Port number for Express API server | 8000 |
OPENROUTER_API_KEY |
Authentication bearer token from OpenRouter | sk-or-v1-... |
MODEL |
OpenRouter model identifier | google/gemini-2.5-flash |
MAX_TOKENS |
Maximum completion token limit per pipeline step | 800 |
GET /Response (200 OK):
{
"success": true,
"message": "AI Code Reviewer API is running 🚀"
}POST /api/review(Also aliased at 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": "The function performs basic addition but lacks type checking for JavaScript's dynamic typing.",
"rating": 7,
"strengths": [
"Concise implementation",
"Clean functional logic"
],
"issues": [
"Lack of input validation allows unexpected string concatenation"
],
"improvements": [
"Add explicit typeof validation or switch to TypeScript",
"Include JSDoc documentation"
],
"bestPractices": [
"Validate input arguments before performing arithmetic operations",
"Document function contracts with JSDoc parameters"
],
"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": { ... }
}- Run ESLint check:
cd frontend && npm run lint
- Run Vite production bundle build:
cd frontend && npm run build
- Use the included REST Client file
backend/test.httpin VS Code / Cursor. - Or send a test request via
curl:curl -X POST http://localhost:8000/api/review \ -H "Content-Type: application/json" \ -d '{"code": "function calculate(x, y) { return x / y; }"}'
- Fork the repository
- Create a feature branch (
git checkout -b feature/AmazingFeature) - Commit your changes (
git commit -m 'Add AmazingFeature') - Push to your branch (
git push origin feature/AmazingFeature) - Open a Pull Request
Distributed under the ISC License.