Technical Case Study
Kodezi
AI-Powered Web IDE & Developer SaaS — 200K Users, Product Hunt Launch of the Month, v1 through v4
Kodezi, an AI-powered Web IDE I built across four versions — from a Next.js MVP to a platform with 200,000 active users. It analyzes your full codebase to debug, generate, refactor, translate, and document code in real time. I built the Monaco Editor integration, KodeziChat with Socket.io streaming, Stripe subscription billing with a credits system, the VS Code extension UI, and a separate automated system status tracker.
Kodezi is not a thin wrapper around an LLM API. It's a full in-browser IDE — Monaco Editor with multi-tab state, diff views, codebase-aware context — with OpenAI integration that understands your actual project, not just the snippet you paste in. I built it from v1 through v4: the initial MVP, KodeziChat with real-time Socket.io streaming, a credits-gated subscription system enforced at the API level, a VS Code extension with native-feeling Webview UI, and separately, an automated system status tracker that replaced manual monitoring entirely. The 200K user milestone and Product Hunt Launch of the Month were outcomes of getting the product architecture right across four iterative versions.

The Problem
Developers lose significant time context-switching between their IDE, documentation, and AI tools that don't understand their codebase. Existing AI coding tools either worked only on single files, required copy-pasting code out of the editor, or had no understanding of the broader project context. There was no in-browser IDE that combined a professional editor with AI that actually knew what was in your project.
The Solution
Built Kodezi across four versions: a Monaco-based in-browser IDE with OpenAI integration that operates on full codebase context, real-time AI chat via Socket.io streaming, a credit-gated subscription system enforced server-side, PDF-to-code generation, cross-language translation, a VS Code extension with a native-feeling Webview UI, and a separate automated system status tracker. Each version built on a stable foundation rather than rewriting what worked.
Results & Impact
200K active users. Product Hunt Launch of the Month (February 2023), Launch of the Week, and two Launch of the Day awards. The platform scaled from a single-developer MVP to a multi-version SaaS with real-time AI, gated premium features, in-editor tooling, and fully automated infrastructure monitoring — without requiring a rewrite of the core architecture between versions.
My Role
Responsibility
Core full stack engineer across all four versions. V1: built from scratch — website, Web IDE, backend APIs, Stripe subscriptions. V2: led KodeziChat UI and Socket.io streaming integration, built the VS Code extension Webview UI. V3: contributed to Kodezi Cloud in a team. V4: rebuilt the dashboard, implemented multi-subscription Stripe handling. Built the Auto System Status Tracker independently as a separate deployment.
Kodezi team profile, archived Oct 2024“Assad didn't just write code, he thought through the architecture before the first line was typed. He joined us for the initial MVP and performed so well that we brought him on as a founding full-stack engineer. Over four major versions, he shipped the AI-powered IDE, the real-time KodeziChat experience, the VS Code extension, and a completely automated system status tracker, all while we scaled to 200,000 users and won Product Hunt Launch of the Month.”
Ishraq K.CEO & Founder
Key Highlights
Monaco-Based Web IDE with Full Codebase AI Context
Built a professional in-browser IDE using Monaco Editor — the same editor that powers VS Code — with multi-tab state, diff views, and OpenAI integration that operates on the full project context, not just the open file. Features include bug detection with fix suggestions, code generation from natural language, cross-language translation, documentation generation, and PDF-to-code conversion.
KodeziChat — Real-Time AI Streaming via Socket.io
Built the complete KodeziChat UI and Socket.io integration for token-by-token AI streaming. The assistant is codebase-aware — it understands the files you have open and can generate, modify, and explain code in context. Real-time streaming keeps perceived latency low even when the model response takes several seconds to complete.
API-Level Subscription Gating with Credits System
Implemented a daily credits system (25 free per day) with all premium AI features enforced at the API layer against live Stripe subscription status. The frontend doesn't control access — the backend does, on every request. This pattern prevents the common bypass of disabling frontend checks.
Scaled to 200K Users Across Four Versions
Contributed core engineering from v1 (MVP built from scratch) through v4 (multi-subscription billing rebuild). Each version shipped on a working foundation rather than a rewrite. Product Hunt Launch of the Month in February 2023. The architecture was designed to scale, which is why it didn't need replacing as the user count grew.
VS Code Extension with Native-Feeling Webview UI
Built the full VS Code extension UI using the Webview API with React and TypeScript. The extension surfaces Kodezi's AI debugging, code generation, and KodeziChat directly inside VS Code with theme-aware styling — it adapts to the user's active editor theme rather than looking like an embedded webpage.
Automated System Status Tracker — Zero Manual Ops
Built and deployed a separate monitoring system that pings every Kodezi service API on a schedule, stores response status in a database, and renders a 90-day color-coded health history per service. Green = fully up, orange = down under 12 hours, red = down over 12 hours. AWS EC2 + Nginx + SSL + GitHub Actions CI/CD. No human updates the status page — the system does it.
Key Features
Monaco Editor: multi-tab state management, Diff Editor, in-browser code execution
AI-powered bug detection with explanation and fix suggestions
Code generation from natural language instructions
Cross-language and cross-framework code translation
Automated documentation generation from existing code
PDF-to-code conversion via OpenAI
KodeziChat: codebase-aware AI assistant with Socket.io token-by-token streaming
Daily credits system: 25 free credits, premium features server-side gated by Stripe subscription
Stripe recurring subscription billing with webhook handling
Paddle payment gateway as secondary provider
Multi-subscription support tied to single Stripe customer ID (v4)
User dashboard: file management, subscription management, credits tracking
Google Auth and email authentication
Amazon SES for transactional email delivery
Intercom for in-app support and behavioral analytics
GSAP and Lottie animations across marketing and dashboard UI
VS Code extension: Webview panels for AI debugging, generation, and KodeziChat in-editor
VS Code theme-aware styling via CSS variables for native editor feel
Automated status tracker: scheduled API pinging, database-backed 90-day health history
Color-coded daily bars per service: green (up), orange (<12h down), red (12h+ down)
AWS EC2 + Nginx + SSL infrastructure for status tracker
GitHub Actions CI/CD pipeline for automated status tracker deployments
Key Metrics
Active Users
200K
Product Hunt
Launch of the Month — February 2023
Versions
v1 built from scratch through v4
AI Features
Debug, generate, translate, docs, PDF-to-code
Credits Model
25 free/day — premium gated server-side by Stripe status
Status Tracker
90-day automated health history, zero manual ops
Assad is honest, reliable and trustworthy. I had quite a complicated bit of coding that was required and Assad made light work of it. The project was scheduled to be completed within 3 days but Assad worked all through the night to get my work complete in 1 day. An absolute pleasure to work with and highly recommended.
Nab Z.
Software Engineer
System Architecture
Next.js frontend with MUI component system
MongoDB for user data, code files, credits state, and subscription records
Monaco Editor: multi-tab management, Diff Editor, in-browser execution context
OpenAI API pipeline with full codebase context for AI feature requests
Socket.io streaming layer for KodeziChat real-time token-by-token delivery
Stripe Subscription API with webhook handling and server-side credits enforcement
Paddle as secondary payment gateway
Google Auth + Amazon SES for authentication and transactional email
VS Code Webview API with React + TypeScript for extension UI
Extension host / Webview message-passing for bidirectional communication
Automated API health pinging system with database status persistence
90-day health history with threshold-based color classification per service
AWS EC2 + Nginx reverse proxy + SSL for status tracker infrastructure
GitHub Actions CI/CD for automated status tracker deployments
Frequently Asked Questions
Kodezi is an AI-powered Web IDE that analyzes your entire codebase — not just the current file — to detect bugs, suggest fixes, generate new code from natural language, translate between languages and frameworks, and produce documentation. The core problem it solves is context switching: developers constantly jump between their IDE, documentation, Stack Overflow, and ChatGPT. Kodezi collapses that into one environment that already understands your project.
V1: I built everything from scratch — the full website UI, Monaco-based Web IDE, backend APIs, and Stripe subscription integration. V2: I led KodeziChat, which meant building the entire chat UI and integrating the backend via Socket.io for token-by-token real-time streaming. I also built the VS Code extension UI using the Webview API. V3: Contributed to Kodezi Cloud as part of a larger team. V4: Rebuilt the user dashboard and implemented multi-subscription handling — multiple active Stripe subscriptions tied to a single customer ID, which is a non-trivial billing edge case.
Free users get 25 credits per day for standard features. Premium AI capabilities are gated behind an active paid subscription — and this is enforced at the API level, not just the frontend. The backend checks subscription status against the Stripe customer record on every request to a gated endpoint. The UI doesn't control access; the API does. This prevents the obvious bypass of removing the frontend guard.
KodeziChat is a codebase-aware AI assistant. I built the full frontend and integrated Socket.io for the streaming layer — the model response comes back token by token, not as a complete response. This matters for perceived latency: users see the answer forming rather than waiting for a spinner. The context includes the current file, open tabs, and relevant project files. It's not a generic chatbot with a code block — it knows what's in your project.
It's a separate system I built and deployed independently. It pings every Kodezi service API on a schedule, records the response status in a database, and renders a 90-day health history per service as color-coded daily bars: green for fully up, orange for down under 12 hours, red for down over 12 hours. Deployed on AWS EC2 with Nginx, SSL, and a GitHub Actions CI/CD pipeline. It replaced manual status updates entirely — no human needs to check anything or post a status page update.
A production-grade AI developer tool with a Web IDE, real-time streaming chat, subscription billing, a credits system, and a VS Code extension is a large scope. Budget $40,000 to $120,000 depending on AI integration depth, editor feature complexity, and the scale targets you're designing for. The Stripe and authentication work is a known quantity. The editor integration and streaming infrastructure are where scope varies most significantly.
Architecture
- Monaco Editor-based Web IDE with multi-tab state and Diff Editor
- OpenAI API pipeline with full codebase context for all AI features
- Socket.io streaming layer for real-time token-by-token AI chat delivery
- Server-side credits-gated API access enforced against live Stripe subscription status
- VS Code Webview React UI with extension host message-passing
- Automated API health monitoring with 90-day database-backed history
- Multi-version SaaS architecture from single-developer MVP to 200K users
Use Cases
- AI-powered developer productivity SaaS platforms
- In-browser code editors and Web IDE applications
- Real-time AI chat tools with codebase awareness
- Subscription-gated developer tools with credits systems
- VS Code extensions with custom AI-integrated Webview UIs
- Automated service health monitoring for SaaS products
Challenges Solved
- Delivering codebase-aware AI assistance inside a browser-based IDE
- Real-time AI response streaming with low perceived latency via Socket.io
- Enforcing subscription-gated feature access at the API level with a per-day credits model
- Handling multiple concurrent Stripe subscriptions under a single customer ID
- Building a VS Code Webview UI that adapts to the user's active editor theme
- Replacing manual status page updates with a fully automated monitoring system
Technical Specs
- Platform Type
- AI-Powered Web IDE & Developer SaaS
- Frontend
- Next.js + Material UI (MUI)
- Database
- MongoDB
- Editor
- Monaco Editor (multi-tab, Diff Editor)
- AI Integration
- OpenAI API — debug, generate, translate, docs, PDF-to-code
- Real-Time Chat
- KodeziChat via Socket.io token-by-token streaming
- Payments
- Stripe Subscriptions + Paddle Payment Gateway
- Auth
- Google Auth + Email
- Amazon SES
- Support & Analytics
- Intercom
- VS Code Extension
- Webview API with React + TypeScript (v2)
- Status Tracker
- Automated 90-day health monitor — EC2 + Nginx + CI/CD
- Users
- 200,000 active users
Built Under
SaaS Engineering Systems
Scalable SaaS platforms, subscription systems, and production-grade architectures.
View System →