Tutorial

Tutorial 1: From Prompt to Prototype: One‑Shot Coding in Boxel

Turn a single prompt into a working Boxel app. Describe a use‑case, let the AI write code, preview, auto‑fix imports, and inject sample data. Accept the files and start using the software immediately—building and testing in the same flow.

One‑Shot Coding

Boxel is a software‑creation and hosting environment that lets you use AI to describe the software you want and start using it immediately. Unlike other vibe‑coding platforms, there’s no separation between developing the software and using it. In fact, Boxel users flip back and forth between making changes and then using the software to test those changes—much like working in Excel, where you tweak formulas until the spreadsheet reflects the rules and formatting you need.

A simple way to get started is to describe a use‑case you’d like to build. Open an AI‑assistant session and type a prompt such as:

  • “Create an expense tracker.”

  • “Create a landing page for a psychologist.”

  • “Create an emoji‑based formatting tool.”

Type your prompt in the AI‑assistant panel and press Enter. The AI agent will carry out several steps to write the required code.

When the generation is finished, click Accept to apply the changes.

If you need to locate the generated file, switch to Code Mode and look for it in the file list, or scroll up in the assistant, open the menu, and choose Open in Code Mode.

If no errors occur, you can immediately Preview the result.

Handling Errors

Occasionally, code generation produces errors. Click Fix It to let the AI resolve them automatically.

Adding Sample Data

From an Isolated View template, you can edit fields manually. To have the AI create sample data:

1. Open the Instance pop‑up.

2. Click Fill in Data with AI.


3. Click Accept.

Interact Mode

Return to Interact Mode to see your data in the card browser.

You can create another instance via … → Create another card like this.

  • Enhance the card (add features, buttons, or styling)—covered later.


Congratulations! You’ve built your first Boxel app, ready to capture data and leverage Boxel’s computation infrastructure to process it.

prompt, prototype, coding