Frontend Apps
1. Overview
Frontend Apps are interface applications (static sites, SPAs, dashboards) hosted and published by the platform. The listing screen is filterable by Squad, shows the columns App, Stack, Branch, Artifacts, Sync, Last Update, Environments, and Actions, and has two creation buttons: Create App (via vibe code) and Import from GitHub.
2. Creating a Frontend App
There are two ways to create a Frontend App:
Vibe Code (Create App)
The Create App wizard generates the application from a natural-language description:
- Describe what you want to build (e.g. "A landing page for a coffee shop with menu and contact form...").
- Choose the AI Model used to generate the code (e.g.
Claude Sonnet 4.6). - Click Next — the platform asks follow-up questions and then scaffolds the app.
When created via vibe code, the platform already takes care of the Dockerfile automatically — nothing needs to be configured manually for that part.
Import from GitHub
Imports an existing frontend from a Git repository:
| Field | Required | Description |
|---|---|---|
| App Name | Yes | App name. Lowercase letters, numbers, and hyphens only. |
| GitHub URL | Yes | Repository URL (e.g. https://github.com/owner/repo). |
| Branch | Yes | Branch used for build/deploy. Default: main. |
| Container Port | Yes | Port exposed by the application's container. Default: 80. |
| App Folder in Repository (optional) | No | Subfolder of the app within the repository, if not at the root (e.g. apps/api). |
| Dockerfile Path (optional) | No | Dockerfile path, relative to the app folder. Default: Dockerfile. |
| Additional folders (optional) | No | Monorepo sibling folders required for the build (e.g. flow-api,components). |
| GitHub Token (optional) | No | Access token, needed only for private repositories. It's encrypted before being stored. |
When imported from GitHub, a correctly configured Dockerfile is mandatory in the repository — the platform builds the application from it to be able to run it. Without a configured Git repository, the build can't be done.
3. Environments
Each Frontend App has environments (e.g. Test, Production), each showing:
| Field | Description |
|---|---|
| Status | E.g. Running, Not Deployed. |
| Artifact | Identifier/tag of the image published in that environment. |
| Replicas | Number of replicas running. |
| Memory | Allocated memory. |
| Secrets | Secrets bound to that environment. |
| ConfigMaps | Config Maps bound to that environment. |
4. App IDE
Opening a Frontend App (Open IDE) shows a screen with 4 tabs:
| Tab | Description |
|---|---|
| Code | Repository file editor, with a file tree on the left. |
| Preview | Live preview of the running application. |
| Preview Logs | Logs of the preview execution. |
| Builds | The application's build history. |
The Build button (top-right corner) triggers a new build of the application from the configured repository.
AI Copilot
In the right side panel, the AI Copilot lets you ask AI to modify, create, or analyze the app's code, with quick shortcuts like Error handling, Refactor, and Add tests. You can choose the AI model used (e.g. Claude Sonnet).
5. Publishing a Frontend App
Unlike a Backend App, publishing a Frontend App is more direct: just build and deploy — the platform automatically generates a public link to access the application. There's no need to configure a route in API Management.
6. FAQ
Can a Frontend App call a Flow or Backend App? TODO: confirm the integration pattern (e.g. via an environment variable with the Flow/Backend App's URL, using a Config Map).
Can I use my own Dockerfile even when creating via vibe code? TODO: confirm whether it's possible to customize the Dockerfile automatically generated by vibe code.