What is UIBUILDER and what is it for?

UIBUILDER's main purpose is to be a foundation on which you can build any web app or user interface and enhance that with data from Node-RED.

It provides 2-way data communications between Node-RED and browser clients. Provides some scaffolding to make the creation and management of web pages easy, including the management of any dependencies.

It helps minimise or eliminate the need for writing front-end code but where code is desired, provides helpers to make things simpler and smooth out the inconsistencies in HTML. But, for people or teams with even a little web development knowledge, it enhances existing web development workflows and supports existing tooling.

It requires no complex frameworks, though it will work with them if you wish. Instead it simply enhances native browser HTML, CSS and JavaScript capabilities and levels out some inconsistencies making things easier and more consistent to use.

UIBUILDER is a bridge between the Node-RED server and any connected clients (web browser tabs).

Each browser tab pointing at the same uibuilder instance is a client and you can have many clients running from 1 browser, 1 device/many browsers, many different devices, or different users - however you like. It lets you filter communications by client ID, uibuilder url, page name, Socket ID, IP address, and browser tabs. So true multi-user applications can be built. v7 also introduces support for the same authenticated client data as Dashboard 2.0.

It includes many helper features that can reduce or eliminate the need to write code for building data-driven web applications and user interfaces. It utilises standard HTML/CSS and is not a framework. You can use it with a front-end framework if you like, but in many cases you won't need one.

UIBUILDER provides Node-RED users with a flexible alternative to the Dashboard.

Dashboard was extremely simple to start using and great for doing relatively straight-forward UI's very quickly. However, if you want to do more complex things, you may quickly hit the brick-wall that is common with many frameworks. Suddenly things can go from being simple to very complex.

UIBUILDER simply does the complex background tasks for you and then gets out of the way.

2 Likes