Platform
Builder: the AI pair that ships real apps
Describe what you want in plain language and watch a real React, TypeScript and Supabase application take shape beside the conversation — with git, checkpoints and a live preview built in.
Builder is Ciao's development workspace: chat on the left, your live application on the right. Unlike AI coding tools that stop at generated code, Builder pairs every conversation with inspect-to-prompt, a prompt queue, branch-native git, undo, checkpoints, live preview and a full-stack console — so plain-language requests become real, running software you own.
Published 2026-07-03 · Last updated 2026-07-03
One window between an idea and a running app
Most AI coding tools produce code and consider the job done. Running that code, previewing it, versioning it and recovering from the change that broke login are left to you — which is exactly where non-engineers stall and where engineers lose the afternoon. The distance between a generated diff and a working application is the real cost of AI-assisted development, and it rarely shows up in the demo.
Builder closes that distance. It is one workspace: the conversation with Ciao on the left, your live application on the right. You describe what you want in plain language, Ciao writes real React and TypeScript against a Supabase backend, and the preview in front of you updates. Branching, checkpoints, undo and logs are already in the window, so a serious change never has to leave it.
How a Builder session runs
1. Describe the change
Type what you want in plain language — a new screen, a rule change, a report. Ciao plans the work and writes real code, not configuration inside a closed tool.
2. Point instead of describing
With inspect-to-prompt, click any element in the live preview and your next prompt attaches to that exact component. No more paragraphs trying to explain which button you mean.
3. Queue your next thoughts
The prompt queue holds follow-up requests in order while the current build runs. Ideas land in the queue, not in a notes file you will forget about.
4. Work on a real branch
Builder is branch-native: every piece of work happens on a git branch, so experiments stay isolated and nothing edits the published application directly.
5. Watch it run live
The live preview is the actual application — real routes, real data, real auth — not a static mock-up. What you see is what will ship.
6. Undo, or jump to a checkpoint
One-click undo reverses the last change; checkpoints mark known-good states you can return to at any time. Bold attempts stop being risky.
7. Look under the hood
The full-stack console shows frontend errors, backend logs and database activity in one place, so "why is this broken" has a single place to look.
Why it matters
Builder produces standard React, TypeScript and Tailwind that you own outright — exportable to your own repository at any time. That matters because the alternative is momentum inside someone else's format: months of work you cannot take with you.
It also matters because Builder does not work alone. Every Ciao workspace comes with an AI software organization — CTO, Doctor, QA analyst, Security engineer, Coder and SysOps operator — so what you build in Builder flows into Guardrails review, automated QA and live security testing before it reaches users. The chat window is the front door to a delivery loop, not the whole product.
Who uses Builder
- Founders and operators — People who can describe the product precisely but do not write code — they get a real application they own, not a prototype with an expiry date.
- Product managers and domain experts — The people closest to the workflow build the internal tool themselves, on a branch, with review before anything merges.
- Engineers — Developers use Builder to move faster on well-understood work while keeping the git discipline, checkpoints and full-stack visibility they would have set up anyway.
- Agencies — Client work gets the same loop: build in conversation, show the live preview in review calls, ship through gates.
Security and governance notes
- ✓ Every change happens on a git branch — nothing edits the published application directly.
- ✓ Guardrails maps code into business areas and applies plain-English policies before risky changes merge.
- ✓ QA runs smoke gates before publish and production checks after.
- ✓ An append-only audit trail covers prompts, merges, deploys and admin actions.
- ✓ Customer code is not used to train models; inference runs under zero-retention model contracts.
- ✓ 100% code ownership — export standard React, TypeScript and Tailwind to your own repo at any time.
Builder vs a prompt-only workflow
The difference is not the model writing the code — it is everything around the code.
| Prompt-only AI coding | Ciao Builder | |
|---|---|---|
| Seeing the result | Copy code out, run it locally | Live preview updates next to the chat |
| Targeting a fix | Describe the element in words | Click it — inspect-to-prompt attaches the component |
| Follow-up ideas | Wait for the run, then re-type | Prompt queue holds them in order |
| Version control | Manual commits, if any | Branch-native git, undo and checkpoints |
| Debugging | Separate terminals and dashboards | Full-stack console in the same window |
Frequently asked questions
Do I need to know git to use Builder?
No. Builder is branch-native under the hood: it creates branches, commits work and manages merges for you. Engineers can drop to the git level whenever they want, and the full history is there when you export the code.
What exactly does inspect-to-prompt do?
You click an element in the live preview — a button, a table, a form — and Builder attaches that component's context to your next prompt. A request like "make this sortable" lands on the right code the first time instead of being interpreted from a written description.
What happens when a change breaks something?
You have three layers: one-click undo for the last change, checkpoints to return to a known-good state, and QA smoke gates that catch failures before a publish happens. Production checks run after publish as well.
Can I take the code somewhere else?
Yes. Ciao generates standard React, TypeScript and Tailwind with a Supabase backend, and you own 100% of it. Export to your own repository at any time — there is no proprietary runtime the app depends on.
How do I start, and what does it cost?
Individual builders start self-serve with credits — describe your first app and go. Serious production programs start at USD 10,000 per year; see the pricing page or talk to sales about what your team needs.