Overview
BuildX AI is a platform that generates full-stack web applications from high-level requirements. By providing a minimal set of inputs, you can create an application with frontend UI, backend logic, database structure, authentication, and a ready-to-use project folder.
BuildX AI is designed to help developers and teams move fast while still working with a clean, extensible codebase.
What BuildX AI Generates
When you create an application using BuildX AI, it generates:
- Frontend pages and reusable UI components
- Backend APIs and core logic
- Database schema and related files
- Authentication (login and user management)
- A structured project folder with generated and configurable files
Create Your First App
You can create your first application in just a few minutes.
- Create a new app in BuildX AI
- Provide the required inputs (App Name, Description, Pages, Tables)
- Start the generation process
- Preview the generated application
- Refine the UI using the UI Components Agent
Required Inputs
To generate an application, BuildX AI requires the following inputs.
App Name
The name of your application. This is used as the primary identifier across the generated project.
Example: BuildX CRM
Description
A short description explaining what your application should do. This helps BuildX AI understand the business logic and features.
Example: A CRM platform to manage customers, leads, and sales activities.
Pages
A list of pages (screens/routes) that should exist in your application.
Example:
• Home
• Login
• Dashboard
• Profile
• Settings
Tables
Defines the database tables and fields required by your application.
Example:
Users
• id
• name
• email
• password
Projects
• id
• name
• description
• created_at
App Generation
Once all inputs are provided, BuildX AI starts generating the application.
During generation, BuildX AI:
- Creates frontend UI and pages
- Generates backend APIs
- Sets up database schema
- Configures authentication
- Produces a complete project folder
After generation, the application is immediately ready for preview and editing.
Overview
The UI Components Agent allows you to modify the generated UI using natural language prompts. This enables fast iteration without manually editing code.
Editing UI Components
Steps to edit a UI component:
- Hold Cmd (Mac) or Ctrl (Windows)
- Click on the UI section you want to edit
- Enter a prompt describing the change
- The UI updates automatically
Example Prompts
"Make this button larger and primary"
"Change this form to a two-column layout"
"Add validation error messages to this input"
"Convert this section into a card layout"
Project Structure (High-Level)
Overview
BuildX AI generates a structured project that separates AI-generated logic, configuration, reusable components, and application entry points. This structure is designed to be readable, maintainable, and extensible.
At a high level, the project consists of:
- AI-generated assets
- Configuration-driven files
- Reusable React components
- A generated HTML entry point
Purpose
The ai-generated/db directory contains database-related files that are always present in every BuildX AI project.
These files are generated automatically based on the Tables input provided during app creation.
Structure
Typical contents include:
- Database schema definitions
- Table mappings
- Relationship definitions
Each file represents structured data definitions that the backend uses to interact with the database.
Note: These files should generally not be edited manually unless you need advanced customization.
Purpose
The ai-generated/docs directory contains internal documentation generated by BuildX AI.
This folder is always present and serves as a reference for:
- Generated entities
- Data models
- Application behavior
Structure
Files inside this folder typically include:
- Descriptions of generated tables and entities
- Metadata about application structure
These files help maintain consistency between generated code and configuration.
Purpose
The config/pages directory defines the structure and configuration of application pages.
This folder is always present.
Structure
Each file represents a page configuration, including:
- Page name
- Associated components
- Routing information
These configuration files drive how pages are rendered in the frontend.
Purpose
The config/navigation directory defines navigation structure for the application.
This folder is always present.
Structure
Files in this directory typically define:
- Navigation menus
- Routes and labels
- Page ordering
Updating these files changes how users navigate through the application.
Purpose
The config/entities directory is generated based on the entities (tables) defined for the project.
This folder is project-dependent.
Each entity has its own folder.
Entity Folder Structure
Each entity folder contains:
list.js
Defines how a list or table view of the entity is rendered.
Typically includes:
- Columns configuration
- Data mapping
- Display logic
This file controls how entity records are displayed in lists or dashboards.
form.js
Defines the form used to create or edit entity records.
Typically includes:
- Form fields
- Validation rules
- Field types and layout
This file controls how users input and update entity data.
Overview
The components directory contains reusable React components generated based on project requirements.
These components are shared across pages and entities.
Folder Structure
The components directory contains the following folders:
forms
Contains reusable form-related React components such as inputs, dropdowns, and validation elements.
list
Contains reusable list and table components used to display collections of data.
navigation
Contains components related to menus, sidebars, headers, and navigation controls.
pages
Contains page-level components composed using forms, lists, and navigation components.
Purpose
index-generated.html is the main generated HTML entry point for the application.
Description
This file:
- Serves as the root HTML file
- Bootstraps the frontend application
- Connects generated scripts and assets
Note: This file is generated automatically and should generally not be modified manually.