Prajyot Porje
Prajyot PorjeProduct Engineer
ALL LOGS
10 July 20266 min read

I Built an AI That Writes Code. Here's What Actually Broke.

Everyone is building AI wrappers these days. I know that. I built one too.

DevFlow is an AI-powered code generator. Type a prompt, get a full multi-file React + Vite project — generated, running, and previewed inside the browser. No local setup, no deployment config. Just describe what you want, and it exists.

DevFlow — landing page and workspace dashboard
DevFlow — landing page and the generate workspace

One thing upfront: DevFlow generates functional apps, not beautiful ones. The architecture is solid — the limitation is the models. I'm on free-tier OpenRouter APIs. Free models follow instructions. They don't craft UI. That's not something better code fixes.

The pipeline.

Gemini 2.5 Flash plans the project — files, dependencies, design system, build order — as a structured JSON blueprint. Then a pool of builder models on OpenRouter generates each file concurrently, two at a time, saving incrementally to Convex so nothing is lost if the browser crashes mid-run.

Problem one: the code was broken.

Free models produce code that looks right but often isn't. Unclosed JSX, wrong import paths, missing exports. The fix was a self-healing pipeline: every file hits a Babel parser first. If it fails, the exact error goes back to Gemini with a repair prompt. Two attempts max, then the file is flagged.

text
Fix all syntax errors in the following code. Return ONLY the corrected file content. No explanation, no markdown, no code fences.
Filename: ${filename}
Error: ${errorMessage}
Code to fix:
${code}
DevFlow code editor — file explorer and live preview
The workspace: code editor, file explorer, and live preview side-by-side

Problem two: the browser was crashing.

The preview runs inside a WebContainer — a WASM Node.js kernel that boots in the tab. Models would generate Tailwind configs with glob patterns like "**/*.{js,ts,jsx,tsx}" which, inside a WASM filesystem with node_modules mounted, scans thousands of files and freezes the tab. One regex before mounting fixed it:

typescript
code = code.replace(
  /content\s*:\s*\[[\s\S]*?\]/g,
  'content: ["./index.html", "./src/**/*.{js,ts,jsx,tsx}"]'
);

Problem three: rate limits.

Free APIs rate-limit fast. I built a model rotation queue — Laguna, Nemotron, Llama, Qwen, GPT-OSS. When one 429s, it's flagged for the session and the next takes over. The first model that succeeds becomes the winner for all remaining files, keeping the generated code stylistically consistent.

The honest version.

DevFlow is not V0. It's not Bolt. Those tools have paid models and full teams. DevFlow runs on free APIs, built by one person in college. The architecture works. The output quality is where the ceiling shows.

The impediment to action advances action. What stands in the way becomes the way.

Marcus Aurelius

The constraint forced a more resilient system. Self-healing, model fallbacks, concurrency logic — none of it would exist with one reliable paid API. I'll take that trade.

DevFlow projects dashboard
The projects dashboard — all your generated workspaces in one place

DevFlow is live at dev-flow-lime.vercel.app with a daily usage limit to keep free-tier APIs from dying. Code is on GitHub — the WebContainer integration, Babel validation, and concurrency runner are all readable there.

This was the most complex thing I'd built at the point I shipped it. What I remember most is staring at a crash log at 1am with no obvious answer — and staying with it until something clicked. That's what I mean when I say I'm an engineer.

SIGNING OFFPrajyot
Share Log:X / TwitterLinkedIn