8 min read · Updated 2026-09-09
Scaffold a Vite + React app from a prompt
How to get a real Vite + React + Tailwind project from an AI agent — SPEC.md, npm install, live preview — instead of a single dumped index.html.
Say the stack in the first line
Open with “Scaffold Vite + React + TypeScript + Tailwind.” If you only say “build an app,” some agents default to static HTML. Naming the stack forces a package.json, src/ tree, and a runnable preview.
Website or App task type
Use Website for multi-page marketing/product sites and App for mobile-first interactive tools. In Modurian Build mode, the agent should write SPEC.md with implementation steps, install dependencies in the sandbox, and expose the Vite preview — not paste the entire app into chat.
What “done” looks like
You can run npm run build without errors, navigate routes or sections in Preview, and see components as real files (App.tsx, components/, styles). If the agent only produced index.html despite asking for Vite, stop and restate: “Use Vite React scaffold; do not substitute a single HTML file.”
Iterate like a PR
Ask for one feature per turn: router, then auth UI shell, then API client stubs. Large “add everything” messages create tangled trees. Prefer Plan mode if you need auth + database + admin before any UI.
Export and continue locally
Download or push to GitHub when you want Cursor/VS Code on the same repo. The agent workspace is a bootstrap — your long-term home is still git, CI, and real env vars.
Try it in Modurian
Sign in with Google — no API keys. Build, preview, and deploy in one workspace.
Get started free