LowCodePlatform

The editor#

LowCodePlatform is a drag-and-drop page builder. Components sit in a list on the left, the canvas takes the middle, a property panel covers the right. Drag a component onto the canvas and it lands where you drop it; select one, rubber-band several, or move a group. The property panel handles size, font, colour, corner radius, stacking order, and rotation.

Six basic components: text, button, input, image, video, and line, all declared in a single registry. The registry supplies both list previews and canvas rendering, so adding a component type means adding one entry.

Letting the model write the page#

A page on the canvas is a JSON array where each item is a component object with coordinates, size, and style fields. Give the model the default object for each component type and one worked example, ask for a plain array, and what comes back is the editor’s own data.

A generated page renders on double-click and then drags, edits, and undoes exactly like a hand-built one. Having the model produce a first pass and finishing by hand works because both halves use the same format.

Component interactions are event strings: trigger(action(argument)), where arguments can interpolate {component-id.property}. click(href({input-0.value})) navigates to whatever address the input holds.

Getting the page out#

Four exits: a preview route without the editor, a canvas screenshot, an export that inlines markup and styles into a standalone HTML file, and a publish that stores the data on a backend and returns an addressable URL. Published pages can be reviewed or deleted.