How vly works

The four-step loop — describe, plan, code, deploy — and what’s happening at each step. The mental model to make sense of everything else.

vly turns a prompt into a deployed app through a four-step loop. The loop is the same for the first build and every iteration after.

You write the prompts. vly handles the rest.

Step 1 — You describe

Every change starts with a prompt. The first prompt is your spec; subsequent prompts are edits. Good prompts include:

What it does

A user-facing description of the behavior. Not the implementation.

Who uses it

Roles, permissions, who sees what. Drives the auth model.

What it stores

The nouns of the app — entities and their fields. Drives the schema.

What's special

Anything that’s not obvious. “Real-time”, “needs to scale to 10k users”, “must work on mobile”. Drives architecture choices.

Prompting fundamentals →

Step 2 — vly plans

By default, vly enters Plan mode before generating any code. Planning is fast — usually 5–15 seconds — and produces a written plan with three parts:

1. Schema — the Convex tables and their fields, indexes, and relationships.
2. Pages and routes — the React Router tree, what each page shows, what data it needs.
3. Components and features — the shared components, the auth flow, the integrations.

You read the plan, edit it directly, or reply with a refinement. When you approve, vly proceeds to code.

You can skip Plan mode for tiny edits (“change the button color to violet”) by setting your default mode to Code mode. For anything that affects multiple files or the schema, leave Plan mode on — it’s the cheapest way to catch a misunderstanding.

Plan mode →

Step 3 — An agent writes the code

vly hands the plan off to one of three coding agents. You pick which:

Claude Code

Anthropic’s Claude. Strong reasoning across many files. Default.

OpenAI Codex

Fast, surgical. Best on small targeted changes.

Gemini CLI

Strong on multi-file design and schema work.

The agent generates a typed React frontend, a Convex backend, and the wiring between them. Output goes into the editor as it’s written — you watch live.

If type-checking fails, the agent self-corrects and retries before showing you the result. You only see the finished, building output.

Step 4 — Auto-deploy

There’s no separate deploy step. The moment a build succeeds, your preview URL updates. If you’ve connected a custom domain, that updates too.

vly maintains two environments by default:

• Preview — every change deploys here automatically. Public, but unindexed.
• Production — promoted on demand. Connected to your custom domain.

Staging vs production →

Behind the scenes

A typical change touches all of these layers:

Crucially, types flow end-to-end: the same Project type Convex returns is the type your React component consumes. There’s no codegen step, no DTO mapping, no “the server returned null but the client expected an array” surprises.

What you keep control of

vly does a lot for you. It does not lock you out of:

The code

Every file is editable in the in-browser editor. Drop into Code mode, make changes by hand, and the preview updates live. Your edits become part of the app’s history.

The schema

Convex schema files are first-class citizens. Edit them by hand or by prompt. vly handles migration when fields change. See Convex migrations.

The design system

Tailwind config and shadcn/ui components are yours to customize. Override colors, fonts, spacing, or replace any component entirely. See Design systems.

Integrations

Add Stripe, Resend, OpenAI, or any of 50+ integrations by prompt or by code. vly maintains the credentials and webhook wiring; you control the business logic.

Custom domains and DNS

Bring your own domain at any tier. Apex, subdomain, multiple environments — all supported. See Custom domains.

What’s coming

vly’s roadmap tracks the major in-flight work. The biggest items:

• Code export — eject your project to a self-hosted Git repo. Top community ask; on the way.
• More agent options — additional models from Anthropic, OpenAI, Google, and others.
• Native mobile — initial support for React Native targets.

Next

Quickstart

Try the loop. Five minutes to a deployed app.

Building with vly

The day-to-day workflow — modes, iteration, version history, collaboration.

Prompting fundamentals

The single biggest lever on output quality.