UI Builder
The Total.js visual editor that describes user interfaces as a JSON file: web apps, dashboards, flowboards and parts.
What UI Builder is: design interfaces as a JSON file
UI Builder is the Total.js visual editor for user interfaces: web apps, dashboards, flowboards and parts, described by a JSON file and rendered by a web component, with no server code.
Use or run the UI Builder editor, and bring your own components
Open the cloud editor or run it yourself with Node.js, what the project contains and how to load your own list of components with the components parameter.
The JSON format of a UI Builder design
The fields of the JSON file that UI Builder saves: metadata, the CSS with the CLASS placeholder, the component tree, inputs, outputs and arguments, with the starting templates as examples.
Build a component for UI Builder
The format of a UI Builder component: one HTML file with its style, a script that exports its metadata and a make function, a settings form and a readme, plus the flags, methods and events of an instance.
Render a UI Builder design in your own page
Show a saved design anywhere with the j-uibuilder web component and the address of its JSON file, with jComponent 20 as the only requirement.