How It Works

Model

The architecture begins with describing the data model that the application will require. The model is created based upon the user prompt (e.g. what site they want to build). From this, relational tables are formed that will inform the rest of the system.

Views

CRUD (Create, Read, Update, Delete) views are then created for each table. These views are used to manage the data in the table. Additional views are created to manage ephemeral state and to provide a connected view across tables. Last, a layer of design views are created to provide images, marketing text, and other pieces of the site.

Views that contain code are called "components". A typical e-commerce site will have about 20-40 components.

Mockup

The views are placed on pages within a hierarchy, which is used to generate the mockup. At this point, most of the views will still be ungenerated components, although a few components are generated for preview purposes (on the homepage). The mockup allows the user to browse the site prior to generating all of the code and to make high-level changes before spending a lot of credits. Our agent (Sysma) is trained to make changes based upon user command.

Note: the mockup does not contain any auth or database functionality - this gets added later, but the system does allow the user to "pretend" to be logged in to preview the functionality that is behind the auth.

Component Generation

A button in the tool allows for all of the component code to be generated at once. Code generation is done by AI. Once all components are generated, it is possible to use them within the preview system to get a feel for how they work. The mockup contains test data that makes this process easy.

Note: once components are generated, it is much more costly to make changes since updates to the architecture must also rewrite component code.

Build & Deploy

The build process transpiles the mockup into a fully-functional website by writing an API layer based upon the model and transpiling components to communicate with it. At this point, auth and database functionality is baked in. The website is then written as code to Github, and can then be easily deployed to Vercel (additional deployment options are coming soon).