Cos’è UI Builder: progettare interfacce come un file JSON

UI Builder è un editor visuale di interfacce utente. Trascini componenti su una tela, li configuri e li colleghi, e il risultato non è codice ma un file JSON che descrive l’interfaccia. Un piccolo web component renderizza quel file ovunque, così un design di UI Builder non richiede implementazione lato server. È open source con licenza MIT; l’editor è il repository totaljs/uibuilder, e puoi usare la versione cloud su uibuilder.totaljs.com.

Queste pagine descrivono UI Builder (revisione 620107a del repository).

A cosa serve

I modelli dell’editor mostrano i tipi di interfacce che costruisce:

Modello	Uso
Web app	un’applicazione web classica
Dashboard	una dashboard di widget di dati
Flowboard	una board collegata a un flusso di dati (funziona con Total.js Flow)
Part	un pezzo di interfaccia riutilizzabile

L’editor elenca anche modelli per app mobili e pannelli HMI, che in questa versione sono disattivati. Total.js presenta UI Builder per moduli web, dashboard, intranet, schermate IoT e interfacce ERP e CRM.

Perché si adatta a Total.js

• Il design sono dati. Un file JSON è facile da salvare in un database, versionare, generare e passare a un altro strumento.
• Non richiede un ambiente speciale. Il renderer è un web component jComponent, così qualsiasi pagina può mostrare un design.
• I tuoi componenti. Un componente è un file HTML con il suo stile, il suo codice e il suo modulo di impostazioni (creare un componente).
• Si integra con Flow e con OpenPlatform, e supporta la localizzazione.

Continua con eseguire l’editor, il formato JSON e renderizzare un design nella tua pagina. La documentazione ufficiale è su docs.totaljs.com/uibuilder.