ForgeUI Builder
de

UI Builder

Den UI-Builder-Editor nutzen oder ausführen und eigene Komponenten einbringen

UI Builder · uibuilder@1 uibuilderinstallcomponents

Der Cloud-Editor

Am schnellsten geht es mit der Cloud-Version des Editors, uibuilder.totaljs.com.

Selbst ausführen

Der Editor ist eine kleine Total.js-5-Anwendung, die statische Dateien ausliefert. Die README nennt drei Schritte:

npm install
node index.js

Laden Sie zuerst den Quellcode von github.com/totaljs/uibuilder herunter. Die Anwendung hat eine Route, die ihre Dateien ausliefert (ROUTE('GET /*')), und die Datei config legt den Namen und das CDN der Oberfläche fest (cdn : //cdn.componentator.com). Der Editor braucht keine Datenbank.

Was das Repository enthält:

Ordner oder DateiWas sie enthält
public/der Editor: ui.js und func.js, die Formulare des Editors (forms/*.html: Einstellungen, Komponenten, Schema, Import, Code, Pfade...) und die Bilder der Vorlagen
public/templates/die Start-Designs: app.json, dashboard.json, flowboard.json, part.json und db.json
public/templates.jsondie Liste der Vorlagen, die der Editor anbietet (eine mobile App und ein HMI-Panel existieren, sind aber abgeschaltet)
public/template.txtdas Grundgerüst einer neuen Komponente (Eine Komponente bauen)
public/render.txteine Seite, die ein Design mit jComponent 20 rendert
cdn/uibuilder.min@1.jsdie Laufzeit, die ein Design rendert (das Objekt UIBuilder der Seite)

Eigene Komponentenliste verwenden

Der Editor liest seine Komponenten aus einer Liste. Sie können ihn auf Ihre eigene Liste verweisen, indem Sie der Adresse den Parameter components hinzufügen, mit der Adresse einer JSON-Datei als Wert:

https://uibuilder.totaljs.com?components=URL_TO_YOUR_JSON_DB

So liefert ein Unternehmen seine eigene Komponentenbibliothek aus, ohne den Editor anzufassen.

Woher die Teile kommen

Das vom Editor gespeicherte Design trägt in seinem Feld components die Adresse der Bibliothek, die jede Komponente enthält, sodass ein Design später von jedem gerendert werden kann, der diese Adresse erreicht (das JSON-Format).