Introduction
Application Builder (Advance Builder in the UI) is MPilot's visual studio for pages and multi-screen applications. Compose layouts on a canvas, connect Data Grids and Reports, add logic in the Code panel, and publish live apps.
Application Builder — shown as Advance Builder in the product — lets teams ship internal tools and customer-facing apps without writing custom React frontends for every use case. You design visually, bind data with {{ expressions }}, and publish applications at /apps/your-slug.
How you build
When you open Advance Builder, you start from the listing — your workspace of pages and applications. From there you pick a path:
- Visual designer. Drag components onto the canvas, configure in the Inspector, and wire event handlers. The clearest way to see layout and UX.
- Code panel. Add variables, queries, functions, and computed values. The logic layer behind bindings and actions.
- Snapshot JSON. Import or export full page definitions — including AI-generated layouts via Paste snapshot JSON.
You can mix all three: scaffold with JSON or templates, then refine visually and add queries in Code.
The anatomy of a workspace
An Advance Builder asset is not just a canvas — it is a set of connected parts. The sidebar in this documentation mirrors that structure:
- Listing — home for all pages and applications, organized in folders.
- Designer — toolbar, nav rail (Components, Outline, Code, Screens), canvas, and Inspector.
- Code panel — variables, queries, functions, computed values, and watchers.
- Components — the widget library: UI chrome, inputs, and MPilot data embeds.
- Integrations — connect List Views, Reports, Dashboards, Forms, Tables, and Picklists.
- Applications — Shell layout + Screens + routes + a single Outlet for screen content.
What you can build
- Internal admin tools. Data grids, filters, and action menus over MPilot tables.
- Customer portals. Multi-screen apps with navigation, search, and detail views.
- Dashboards. Reports and Dashboard components embedded in a custom shell.
- Workflow UIs. MFlow forms inside a branded application layout.
Next steps
- What is Advance Builder? — big picture and when to use it
- Designer layout — tour the visual workspace
- Component library — every widget and what it solves
- Walkthroughs — step-by-step build guides