Skip to content

Orinnn9961/codelens

Repository files navigation

🔍 CodeLens — AI Code Readability Evaluator

Paste code, get a readability score. 7 dimensions. Before/after suggestions. Works with or without an AI API key.

Next.js TypeScript DeepSeek License Tests


What It Does

CodeLens evaluates your code's readability — the human-facing quality that linters and static analyzers can't measure. It checks 7 dimensions:

Naming (25%) · Comments (15%) · Function Length (15%)
Complexity (15%) · Structure (15%) · Format (10%) · Error Handling (5%)

Each dimension gets a 0–100 score, weighted into a final A+ to F grade. Every issue comes with a before/after code example you can apply immediately.

Screenshot

┌─────────────────────────────────────────────────────┐
│  🔍 CodeLens — AI Code Readability Evaluator        │
├─────────────────────────────────────────────────────┤
│  [📝 Paste Code]  [🔗 GitHub URL]                   │
│  ┌─────────────────────────────────────────────────┐│
│  │  1 │ def process(data):                         ││
│  │  2 │     result = []                            ││
│  │  3 │     for item in data:                      ││
│  │  ...                                            ││
│  │     [Python ▼]              [🚀 Evaluate]        ││
│  └─────────────────────────────────────────────────┘│
│                                                     │
│  ┌──────┐  ┌──────────────────────────┐             │
│  │ 78.5 │  │ Naming      ████░░ 82    │             │
│  │  C   │  │ Comments    ██░░░░ 45    │             │
│  └──────┘  │ Complexity  ███░░░ 68    │             │
│   Score    │ ...                        │             │
│            └──────────────────────────┘             │
│                                                     │
│  🟡 line 42: variable 'd' is not semantic           │
│  Before: d = fetch()                                │
│  After:  user_data = fetch_user_profile()           │
└─────────────────────────────────────────────────────┘

Quick Start

# 1. Clone
git clone https://github.com/Orinnn9961/codelens.git
cd codelens

# 2. Install
npm install

# 3. Configure AI (optional — works without it)
cp .env.local.example .env.local
# Edit .env.local, add your DeepSeek or Anthropic API key

# 4. Run
npm run dev
# Open http://localhost:3000

AI Provider Setup

Pick one (or both). The app auto-detects which key is configured.

DeepSeek (recommended — 10× cheaper)

# .env.local
DEEPSEEK_API_KEY=sk-xxxxxxxx
# Get key: https://platform.deepseek.com/api_keys

Anthropic Claude

# .env.local
ANTHROPIC_API_KEY=sk-ant-xxxxxxxx
# Get key: https://console.anthropic.com/

No API key? The app still works — it uses the built-in rule engine for all checks. AI adds semantic depth to naming, comments, structure, and error handling.

Architecture

User Input (code paste / GitHub URL)
       │
       ▼
┌──────────────────────┐
│  Stage 1: Rule Engine │  ← always runs, 0 cost, milliseconds
│  • Function length    │
│  • Cyclomatic complexity (McCabe)
│  • Format consistency │
│  • Naming regex       │
│  • Error handling     │
└──────┬───────────────┘
       │
       ▼
┌──────────────────────┐
│  Stage 2: AI Analysis │  ← optional, 2–8s, semantic understanding
│  • Naming semantics   │
│  • Comment quality    │
│  • Code structure     │
│  • Improvement suggestions │
└──────┬───────────────┘
       │
       ▼
┌──────────────────────┐
│  Stage 3: Scoring     │  ← weighted sum → A+ ~ F grade
│  Σ(dimension × weight)│
└──────────────────────┘

Why hybrid? Pure AI is expensive and unstable. Pure rules miss semantics. Hybrid gives the best of both: deterministic checks where rules apply, AI where understanding matters.

Tech Stack

Layer Technology
Framework Next.js 14 (App Router)
Language TypeScript (strict)
Editor Monaco Editor (VS Code kernel)
Charts Chart.js (radar chart)
AI DeepSeek / Anthropic Claude
Styling Tailwind CSS + custom design tokens
Testing Vitest (24 tests)

Supported Languages

Language Static Analysis AI Analysis
Python
JavaScript
TypeScript
Java
Go

Commands

npm run dev      # Start dev server at localhost:3000
npm run build    # Production build
npm run start    # Start production server
npm test         # Run 24 unit tests
npm run lint     # ESLint

Project Structure

src/
├── app/
│   ├── api/evaluate/route.ts    # POST /api/evaluate endpoint
│   ├── layout.tsx               # Root layout
│   ├── page.tsx                 # Main page (state management)
│   └── globals.css              # Design tokens
├── components/
│   ├── CodeInput.tsx            # Monaco Editor wrapper
│   ├── ScoreCard.tsx            # Animated score ring
│   ├── RadarChart.tsx           # 7-dimension radar
│   ├── DimensionDetail.tsx      # Expandable dimension rows
│   ├── SuggestionCard.tsx       # Before/after issue card
│   ├── DiffViewer.tsx           # Side-by-side diff
│   ├── ResultsPanel.tsx         # Composite results layout
│   ├── InputMethodTabs.tsx      # Paste / GitHub URL tabs
│   └── LoadingOverlay.tsx       # Pipeline progress overlay
├── engine/
│   ├── parser.ts                # Code parser + McCabe algorithm
│   ├── scorer.ts                # Weighted scoring engine
│   ├── grader.ts                # Score → grade mapper
│   ├── ai/
│   │   ├── client.ts            # Multi-provider AI client
│   │   ├── prompts.ts           # Structured prompt templates
│   │   └── response-parser.ts   # JSON parser with fallback
│   └── analyzers/
│       ├── function-length.ts   # Function size scoring
│       ├── complexity.ts        # McCabe complexity
│       ├── naming.ts            # Naming convention checks
│       ├── format.ts            # Format consistency
│       ├── error-handling.ts    # Error handling detection
│       └── index.ts             # Aggregator
├── lib/
│   ├── constants.ts             # Weights, thresholds, patterns
│   ├── language-detector.ts     # Auto language detection
│   └── github.ts                # GitHub URL parser
└── types/
    └── evaluation.ts            # All TypeScript interfaces

FAQ

Q: How accurate is the scoring? The rule engine uses well-established metrics (McCabe complexity, PEP 8 conventions). AI assessments may vary slightly between runs. For consistent results, the AI temperature is set to 0.1.

Q: Can it handle large files? The analysis is capped at 1,000 lines / 100,000 characters. A warning is shown if your code exceeds these limits.

Q: Does it store my code? No. Code is processed in-memory during the API request and discarded immediately. Nothing is persisted to disk or logged.

Q: How much does AI analysis cost? With DeepSeek: ~¥0.01 per evaluation. With Claude: ~¥0.05–0.10 per evaluation. Rule-based analysis is always free.

License

MIT — feel free to use, modify, and share.

About

AI-powered code readability evaluator — 7-dimension analysis with before/after improvement suggestions

Resources

Stars

0 stars

Watchers

0 watching

Forks

Releases

No releases published

Packages

 
 
 

Contributors