Academy
1. Understanding the Code Builder Workspace
Grasp the end-to-end architecture of Code Builder — how a plain-language description becomes a running application inside an isolated cloud sandbox.
Code Builder is an AI development workspace that turns a plain-language description into a running application. The pipeline works in three stages:
- Brief — You describe the app you want: its purpose, main screens, and key behaviors. The richer the brief, the closer the first output matches your intent.
- Generation & Execution — The AI writes the code and immediately executes it inside an isolated cloud sandbox. The sandbox is completely separated from your local machine and from every other user's environment, so nothing you run can leak or interfere.
- Live Preview — The running app is rendered right next to the conversation. Every subsequent change you request refreshes this preview, giving you an instant feedback loop.
This architecture means you never leave the workspace to compile, deploy, or preview — the entire develop-run-see cycle happens in one place.
Execution Profiles define the runtime environment your sandbox uses — think of them as pre-configured containers tailored to different project types. When you start a project, you pick the profile that matches what you're building (e.g., a web app vs. a data dashboard). You can create and manage profiles from the builder settings.
Choosing the right profile matters because it determines which runtimes and capabilities are available inside the sandbox. If your project needs a specific stack, make sure the profile supports it before you start generating code.
Iteration Model — Code Builder is conversational. After the first generation, you refine the app by describing changes in natural language: "make the header sticky", "add a dark-mode toggle", "replace the table with a card grid".
The critical best practice: change one thing at a time. Each request triggers a code edit and a preview refresh. Batching multiple unrelated changes into a single prompt increases the chance of regressions. Treat each message as a focused commit — small, purposeful, and easy to verify in the live preview before moving on.
Ownership & Export — Every file the AI generates belongs to you. Inside the workspace you can browse the full file tree, inspect individual files, and download the entire project. This means Code Builder is not a walled garden: you can export at any point and continue development in your own IDE, CI/CD pipeline, or version-control system.
This is especially useful when you want to use Code Builder for rapid prototyping and then hand the codebase off to a traditional workflow.
Keep an eye on costs as you iterate. Generation and each subsequent iteration consume AI credits, and sandbox execution time is billed separately. Both are displayed in real time inside the workspace, so check them before starting a long refinement session.
Open Code Builder (dashboard → Code Builder). Create a new project, select an execution profile, and type a brief like: "A single-page task manager with add, complete, and delete actions." Watch the AI generate the code and the live preview appear. Then ask for one change — e.g., "add a due-date field" — and observe the preview refresh.
Code Builder's workspace follows a tight loop: describe → generate → preview → iterate → export. Your brief is translated into code and executed in a secure, isolated sandbox with a live preview beside the conversation. Execution profiles let you match the runtime to your project type. Iteration is conversational — one change per message keeps things clean. Generated files are fully yours to review and download. Credits and sandbox time are tracked in real time so there are no billing surprises.