Most developers write code, push it, and hope for the best. Security vulnerabilities, creeping complexity, and silent technical debt only surface during expensive late-stage reviews — or worse, in production.
DevScope AI installs a real-time intelligence layer directly into your development workflow:
- Ask it anything about your code — Big O, maintainability, security gaps
- Upload any file and get targeted refactoring or debugging analysis
- Track your technical debt as a measurable trend over time — not a gut feeling
No more flying blind. Your AI co-pilot is always watching.
| Feature | Description |
|---|---|
| 🔍 Intelligent Analysis | Real-time feedback on Time Complexity (Big O), Maintainability scores, and Security vulnerabilities |
| 📁 Smart File Uploads | Attach .py, .js, or .cpp files with specific refactoring or debugging instructions |
| 📈 Issue Trend Graph | Data-driven line chart tracking code issues over time via persistent SQLite |
| 🎨 Cinematic UI | Glassmorphism Space Theme with a live starfield, terminal-style interface, and smooth animations |
| ⚡ Lightning-Fast AI | Groq LPU inference with Llama 3.3 70B for near-instantaneous responses |
graph TD
subgraph Frontend["🖥️ React Frontend"]
A[👨💻 Developer] -->|Code / File Upload| B[💬 Chat Interface]
B -->|HTTP POST via Axios| C[⚡ FastAPI Backend]
end
subgraph Backend["🧠 Backend Engine"]
C -->|Prompt Engineering| D[🤖 Groq — Llama 3.3 70B]
D -->|Analysis Result| E[📊 Issue Scorer]
E -->|Write Record| F[(SQLite via SQLAlchemy)]
end
subgraph Dashboard["📈 Analytics Layer"]
F -->|Historical Data| G[Recharts Issue Trend Graph]
D -->|Live Response| H[Terminal Chat Bubbles]
end
style D fill:#38bdf8,stroke:#fff,stroke-width:1px,color:#000
style G fill:#38bdf8,stroke:#fff,stroke-width:1px,color:#000
style C fill:#009688,stroke:#fff,stroke-width:1px,color:#fff
style F fill:#003B57,stroke:#aaa,stroke-width:1px,color:#fff
style A fill:#1e1b4b,stroke:#a5b4fc,stroke-width:1px,color:#fff
style B fill:#1e293b,stroke:#38bdf8,stroke-width:1px,color:#fff
| Layer | Technologies |
|---|---|
| Frontend | React.js, Vite, Tailwind CSS, Framer Motion, Recharts, Lucide React |
| Backend | Python 3.8+, FastAPI, Uvicorn |
| AI Engine | Groq SDK — Llama 3.3 70B |
| Database | SQLite, SQLAlchemy ORM |
| File Handling | python-multipart |
| HTTP Client | Axios |
devscope-ai/
├── backend/
│ ├── main.py # FastAPI entry point & API routes
│ ├── analyzer.py # AI logic & Groq API integration
│ ├── database.py # SQLite connection & SQLAlchemy models
│ ├── .env # API keys (environment variables)
│ └── devscope.db # Auto-generated SQLite database
├── frontend/
│ ├── src/
│ │ ├── components/
│ │ │ ├── Sidebar.jsx
│ │ │ ├── ChatBubble.jsx
│ │ │ ├── CodeWindow.jsx
│ │ │ ├── MetricsBar.jsx
│ │ │ ├── InputArea.jsx
│ │ │ ├── IssueGraph.jsx
│ │ │ └── Starfield.jsx
│ │ ├── App.jsx # Main logic & state
│ │ ├── main.jsx # React entry point
│ │ └── index.css # Global styles & Tailwind
│ ├── tailwind.config.js
│ ├── package.json
│ └── vite.config.js
└── README.md
- Python 3.8+
- Node.js v16+ & npm
- A Groq API key (free)
# Navigate to the backend folder
cd backend
# Create and activate a virtual environment
python -m venv .venv
# Windows
.\.venv\Scripts\activate
# Mac / Linux
source .venv/bin/activate
# Install dependencies
pip install fastapi uvicorn sqlalchemy groq python-dotenv python-multipartConfigure environment variables — create a .env file in backend/:
GROQ_API_KEY=your_gsk_key_hereStart the backend:
python main.py
# Running at http://localhost:8000# Navigate to the frontend folder
cd ../frontend
# Install dependencies
# (includes axios, recharts, lucide-react, react-syntax-highlighter, framer-motion)
npm install --legacy-peer-deps
# Start the dev server
npm run dev
# Running at http://localhost:5173| Service | URL |
|---|---|
| Frontend UI | http://localhost:5173 |
| Backend API | http://localhost:8000 |
| API Docs (Swagger) | http://localhost:8000/docs |
💬 Chat — Type any coding question (e.g. "Write an optimized quicksort in Python") and hit Send. The AI responds with code, complexity analysis, and suggestions.
📁 Analyze a File — Click the Paperclip icon or the Upload icon in the sidebar to attach a .py, .js, or .cpp file. Add specific instructions (e.g. "Check this for SQL injection") and hit Send.
📈 Analytics — Click the Bar Chart icon in the sidebar to view your issue trend graph — a persistent record of code health over time.
🔄 Dashboard — Click the Grid icon to reset your current session and start a fresh analysis.
Contributions that improve the following are especially welcome:
- Prompt Engineering — more accurate Big O and security scoring prompts
- New File Type Support — extending uploads to
.ts,.go,.rs,.java - Database Adapters — PostgreSQL support via SQLAlchemy
- UI Themes — additional Glassmorphism or terminal-dark variants
Please open an issue before submitting a large PR so we can align on direction.
This project is open source. See LICENSE for details.
Built for developers who care about code quality. ⚡
DevScope AI — Real-time intelligence. Zero compromise.