A tour of the workspace

Overview

The Emergent workspace is divided into five main areas, each handling a distinct part of the build-test-publish cycle. Understanding this layout will help you move quickly from idea to shipped product.

Chat panel

The Chat panel is where you describe your app, request changes, and ask the agent questions. Every message you send triggers the agent to generate or modify code, install dependencies, and refresh the preview.

Key behaviors:

• The agent reads your entire conversation history, so you can refer back to earlier instructions.
• Attach files - screenshots, designs, CSVs, or any other asset - directly in the chat to guide the build. Learn about file uploads.
• The agent will tell you when it's working, when tests pass, and when the preview is ready.

Preview panel

The Preview panel renders a live, interactive view of your application. Every time the agent completes a code change, the preview auto-refreshes so you can immediately see the result.

What you can do:

• Click through flows, fill forms, test buttons - treat it like the real app.
• Open the preview in a new browser tab for a full-screen experience.
• Use browser DevTools to inspect elements, check network requests, or debug layout issues.

Secrets and environment variables

The Secrets / Env area is where you configure API keys, connection strings, and any other environment variables your app needs.

Important distinctions:

• Secrets stored here apply to the preview environment. After the first publish, preview and production environment variables are separate; changes made here do not automatically apply to future published versions.
• They are encrypted at rest and never exposed in the chat or logs.
• The platform injects a special Universal LLM Key automatically, so you can call OpenAI, Anthropic, and other LLM providers without adding your own keys during development.

STRIPE_SECRET_KEY

Learn more in Secrets & env variables.

GitHub controls

The GitHub controls let you save your workspace code to a repository.

Core actions:

• Save to GitHub: Commit the current state of your workspace to a new or existing repository. This creates a snapshot you can share, review, or roll back to.

For step-by-step instructions, see Save to GitHub.

Publish controls

The Publish controls are where you ship your application to a live, publicly accessible URL.

Available actions:

• Publish: Create a new published app from the current workspace state. You'll receive a unique URL that stays live until you delete it.
• Re-publish: Push the latest workspace changes to an existing published app, preserving the same URL and published app ID.
• Replace: Swap out the code of a running published app with a different workspace or branch, keeping the same domain and environment.

Review your options in Publishing types and Publishing plan levels.

Uploading files and images

You can attach files directly in the chat panel to guide the agent's work. Common use cases include:

• Design mockups: Upload a screenshot or Figma export; the agent will replicate the layout and styling.
• Data samples: Attach a CSV or JSON file; the agent will infer the schema and build import/export flows.
• Icons and logos: Provide brand assets; the agent will reference them in the UI.
• Documents: Share a spec, API response example, or requirements doc; the agent will parse it and apply the details.

How it works:

1. Click the attachment icon in the chat input (or drag and drop).
2. Select one or more files (images, PDFs, spreadsheets, text).
3. Send your message; the agent processes the files alongside your instructions.

Files uploaded to the chat are stored temporarily for the agent's use. If your application needs persistent file storage (e.g., user uploads), see File storage (Emergent Object Store).