# Wat UI Builder is: interfaces ontwerpen als een JSON-bestand

> UI Builder is de visuele Total.js-editor voor gebruikersinterfaces: web-apps, dashboards, flowboards en parts, beschreven door een JSON-bestand en gerenderd door een web component, zonder servercode.

Framework: uibuilder
Product: UI Builder (uibuilder@1)
Language: nl
Content-SHA256: 69115a3383bf04754217bc3e18f2e2abde93983b0a91f406f258c12707f73326
Snapshot: c0700e321579725c5cf4f5ace1ad7d2866d1b4f93c24a63c0b41b6b7998e976c
Sources: 
Review: not-recorded

UI Builder is een **visuele editor voor gebruikersinterfaces**. Je sleept componenten op een canvas, configureert en verbindt ze, en het resultaat is geen code maar een **JSON-bestand** dat de interface beschrijft. Een klein web component rendert dat bestand overal, dus een UI Builder-ontwerp heeft geen implementatie aan de serverkant nodig. Het is open source onder de **MIT-licentie**; de editor is de repository [totaljs/uibuilder](https://github.com/totaljs/uibuilder), en je kunt de cloudversie gebruiken op [uibuilder.totaljs.com](https://uibuilder.totaljs.com).

Deze pagina’s beschrijven UI Builder (revisie `620107a` van de repository).

## Waarvoor het dient

De sjablonen van de editor tonen de soorten interfaces die hij bouwt:

| Sjabloon | Gebruik |
|---|---|
| Web app | een klassieke webtoepassing |
| Dashboard | een dashboard met datawidgets |
| Flowboard | een board dat is verbonden met een datastroom (het werkt met [Total.js Flow](https://www.totaljs.com/flow/)) |
| Part | een herbruikbaar stuk interface |

De editor toont ook sjablonen voor mobiele apps en HMI-panelen, die in deze versie zijn uitgeschakeld. Total.js presenteert UI Builder voor webformulieren, dashboards, intranetten, IoT-schermen en ERP- en CRM-interfaces.

## Waarom het bij Total.js past

- **Het ontwerp is data.** Een JSON-bestand is makkelijk op te slaan in een database, te versioneren, te genereren en aan een ander hulpmiddel te geven.
- **Het heeft geen bijzondere omgeving nodig.** De renderer is een jComponent web component, dus elke pagina kan een ontwerp tonen.
- **Je eigen componenten.** Een component is één HTML-bestand met zijn stijl, zijn code en zijn instellingenformulier ([een component bouwen](/en/uibuilder/build-a-component/)).
- **Het integreert** met [Flow](https://www.totaljs.com/flow/) en met [OpenPlatform](/en/openplatform/what-is-openplatform/), en ondersteunt lokalisatie.

Ga verder met [de editor uitvoeren](/en/uibuilder/run-the-designer/), het [JSON-formaat](/en/uibuilder/the-ui-json-format/) en [een ontwerp in je pagina renderen](/en/uibuilder/render-an-app-in-your-page/). De officiële documentatie staat op [docs.totaljs.com/uibuilder](https://docs.totaljs.com/uibuilder/).