# Co je UI Builder: navrhujte rozhraní jako soubor JSON

> UI Builder je vizuální editor Total.js pro uživatelská rozhraní: webové aplikace, dashboardy, flowboardy a části, popsané souborem JSON a vykreslované webovou komponentou, bez serverového kódu.

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

UI Builder je **vizuální editor uživatelských rozhraní**. Přetahujete komponenty na plátno, nastavujete je a propojujete a výsledkem není kód, ale **soubor JSON**, který rozhraní popisuje. Malá webová komponenta tento soubor vykreslí kdekoli, takže návrh UI Builder nepotřebuje serverovou implementaci. Je open source pod **licencí MIT**; editorem je repozitář [totaljs/uibuilder](https://github.com/totaljs/uibuilder) a můžete použít cloudovou verzi na [uibuilder.totaljs.com](https://uibuilder.totaljs.com).

Tyto stránky popisují UI Builder (revize `620107a` repozitáře).

## K čemu slouží

Šablony editoru ukazují druhy rozhraní, které vytváří:

| Šablona | Použití |
|---|---|
| Web app | klasická webová aplikace |
| Dashboard | dashboard datových widgetů |
| Flowboard | tabule propojená s tokem dat (funguje s [Total.js Flow](https://www.totaljs.com/flow/)) |
| Part | opakovaně použitelná část rozhraní |

Editor uvádí také šablony pro mobilní aplikace a panely HMI, které jsou v této verzi vypnuté. Total.js představuje UI Builder pro webové formuláře, dashboardy, intranety, obrazovky IoT a rozhraní ERP a CRM.

## Proč se hodí k Total.js

- **Návrh jsou data.** Soubor JSON se snadno ukládá do databáze, verzuje, generuje a předává jinému nástroji.
- **Nepotřebuje zvláštní prostředí.** Vykreslovač je webová komponenta jComponent, takže návrh může zobrazit jakákoli stránka.
- **Vlastní komponenty.** Komponenta je jeden soubor HTML se stylem, kódem a formulářem nastavení ([vytvoření komponenty](/en/uibuilder/build-a-component/)).
- **Integruje se** s [Flow](https://www.totaljs.com/flow/) a s [OpenPlatform](/en/openplatform/what-is-openplatform/) a podporuje lokalizaci.

Pokračujte s [spuštěním editoru](/en/uibuilder/run-the-designer/), [formátem JSON](/en/uibuilder/the-ui-json-format/) a [vykreslením návrhu na vaší stránce](/en/uibuilder/render-an-app-in-your-page/). Oficiální dokumentace je na [docs.totaljs.com/uibuilder](https://docs.totaljs.com/uibuilder/).