Skip to content

uibakery/self-hosted

Repository files navigation

UI Bakery is a low-code platform to build apps and automations you never had time for

UI Bakery - Internal tools and workflow automations

Deploying UI Bakery on-premise

Deploy UI Bakery locally to manage your data from your private network

We understand that you might have lots of data accessible from your private network, that’s why you can use UI Bakery self-hosted version for your benefit.

On-premise version grants you:

  • A quick setup process
  • Custom branding
  • Custom domain hosting
  • OAuth2 SSO
  • SAML-based identity providers
  • Data is stored securely under your own VPS

✔️ UI Bakery on-premise version license key can be obtained here

⚠️ If you have already installed UI Bakery on-premise version, follow this guide to update your version.

Table of contents

Installation

This document describes how to deploy ui-bakery on-prem via install.sh script.

⚠️ The script installs docker and docker-compose, which may upgrade some dependencies under the hood. Please be advised that if you run this script on the OS used as a server for other applications, those applications may break due to that potential dependencies upgrade.

Requirements

  • ⚠️ OS Linux Ubuntu 18.04 and above.
  • Must have full rights to use "sudo".

Installation steps

  1. Run this command preferably from /home Linux directory to download, install and launch UI Bakery:

    curl -k -L -o install.sh https://raw.githubusercontent.com/uibakery/self-hosted/main/install.sh && bash ./install.sh
  2. In the process, upon request, enter the previously received license code, hosting URL and port.

  3. Once the installation is completed, open the browser using URL and port provided earlier. By default it is http://localhost:3030/.

NOTE: If Docker of the version less than the required (minimum 20.10.11) is already installed on the server, and/or Docker Compose (minimum 1.29.2), the script will be stopped. You need to update the versions of components manually and run the script again.

Deploying on Azure Virtual Machine

  1. Open Azure Portal and on the search field at the top type in Virtual machines and select this item in the result search window

  2. Click on the + Create button in the top left corner and select Azure Virtual machine in the menu

  3. Select an image of Ubuntu 18.04 or higher

  4. For instance size, select minimum Standard_F2s_v2 - 2 vCPUs, 4 GiB memory

  5. In the Administrator account section in the Authentication type menu item select SSH public key and it will generate the keys after VM creation

  6. In Inbound port rules leave SSH(22) as by default

  7. In the Networking tab select existing or create a new Virtual Network and Subnet used by this VM

  8. In NIC network security group select Advanced

  9. In Configure network security group click Create new

  10. Click + Add an inbound rule

  11. Add {BakeryPort} (use 3030 by default, you will need to select the same port during UI Bakery installation later) in the Destination port ranges

  12. In Protocol Choose TCP

  13. Click Add

  14. Check that SSH (TCP/22) is configured by default. If not, add it manually using the same algorithm as for {BakeryPort}

  15. Click Ok to finish creating a Network security group

  16. Click Review + create

  17. Click Create

  18. After creating and running the virtual machine, connect to it from outside using SSH protocol.

  19. Run this command preferably from the /home Linux directory to download, install and launch UI Bakery:

    curl -k -L -o install.sh https://raw.githubusercontent.com/uibakery/self-hosted/main/install.sh && bash ./install.sh
  20. Upon request, enter the previously received license code, hosting URL - Azure Virtual Machine IP address, and port ({BakeryPort} which you selected in the earlier steps 3030 by default).

  21. After the installation is completed and launched, enter the bakery from a browser on your local machine at http://{Public IP address Azure VM}:{BakeryPort}

Deploying on AWS EC2 instance

  1. Open AWS Management Console and select Services - EC2 (Virtual Servers in the Cloud)

  2. Select Network & Security - Security Groups. Click Create security group button in the top right corner

  3. Input Bakery in Security group name and Bakery security group in Description

  4. In block Inbound rules click Add rule button. Select Custom TCP in the Type, input {BakeryPort} (use 3030 by default, you will need to select the same port during UI Bakery installation later) in the Port range and select Anywhere-IPv4 in the Source

  5. In block Inbound rules click Add rule button. Select SSH in the Type and select Anywhere-IPv4 in the Source

  6. Click Create security group

  7. Select Network & Security - Key Pairs. Click Create key pairs button in the top right corner

  8. Input Bakery in Name. Select RCA in Key pair type. Select .pem in Private key file format, if you will be connecting to the VM using OpenSSH, or select .ppk in Private key file format, if you will be connecting to the VM using Putty

  9. Save the key file to the disk of the local machine

  10. Select Instances - Instance Types. Select t2.medium in the Instance types list. Click Action - Launch instance button in the top right corner

  11. Input 'Bakery' in Name

  12. Select an image of Ubuntu Server 18.04 or higher in the Application and OS Images (Amazon Machine Image)

  13. Select 'Bakery' in Key pair (login) - Key pair name - required

  14. Select 'Bakery' in Network settings - Select existing security group - Common security groups

  15. Input 20 GiB in Configure storage - 1x

  16. Click Launch instance button in the bottom right corner

  17. After creating and running the virtual machine, connect to it from outside (OpenSSH or Putty) using SSH protocol (use the previously saved key file)

  18. Run this command preferably from the /home Linux directory to download, install and launch UI Bakery:

    curl -k -L -o install.sh https://raw.githubusercontent.com/uibakery/self-hosted/main/install.sh && bash ./install.sh
  19. Upon request, enter the previously received license code, hosting URL - Public IPv4 address AWS EC2 Instance, and port ({BakeryPort} which you selected in the earlier steps 3030 by default).

  20. After the installation is completed and launched, enter the bakery from a browser on your local machine at http://{Public IPv4 address AWS EC2 Instance}:{BakeryPort}

Deploying on Google Cloud Compute Engine VM instance

  1. Open Google Cloud Console. On your project page, select Navigation Menu - Compute Engine - VM instances

  2. Select Create an instance - New Vm instance

  3. Input bakery in Name. Select region and zone

  4. Select E2 in Series field and e2-medium in Machine Type field in the block Machine configuration - Machine family - General-purpose

  5. Press Change button in block Boot Disk

  6. Select Ubuntu in the Operation System, Ubuntu 18.04 LTS or higher in the Version and input 20 in Size (GB). Click Select button

  7. Click Create button at the bottom of the page

  8. On your project page, select Navigation Menu - VPC Network - Firewall and press Create a firewall rule button

  9. Input bakery in Name and select All instances in the network in Targets

  10. Input 0.0.0.0/0 in Source IPv4 ranges

  11. Go to the block Protocols and ports. Select Specified protocols and ports and TCP, input {BakeryPort} (use 3030 by default, you will need to select the same port during UI Bakery installation later) in the Port

  12. Click Create button at the bottom of the page

  13. On your project page, select Navigation Menu - Compute Engine - VM instances

  14. Select VM instance Bakery and press SSH - Open in Browser Window. Will be open SSH-in-browser window.

  15. Run this command preferably to download, install and launch UI Bakery:

    curl -k -L -o install.sh https://raw.githubusercontent.com/uibakery/self-hosted/main/install.sh && bash ./install.sh
  16. Upon request, enter the previously received license code, hosting URL - External IP address VM Instance, and port ({BakeryPort} which you selected in the earlier steps 3030 by default).

  17. After the installation is completed and launched, enter the UI Bakery from a browser on your local machine at http://{External IP address Vm Instance}:{BakeryPort}

Manual installation

⚠️ MySQL instance is included into the out of the box container and doesn't require any additional setup. If you need to have a standalone database, read Running a standalone database instance

  • Install docker 20.10.11 version or higher and docker-compose 1.29.2 version or higher

  • Start docker daemon

  • Get on-premise сonfiguration files:

    mkdir ui-bakery-on-premise && cd ui-bakery-on-premise && curl -k -L -o docker-compose.yml https://raw.githubusercontent.com/uibakery/self-hosted/main/docker-compose.yml && curl -k -L -o docker-compose-external-db.yml https://raw.githubusercontent.com/uibakery/self-hosted/main/docker-compose-external-db.yml && curl -k -L -o setup.sh https://raw.githubusercontent.com/uibakery/self-hosted/main/setup.sh
  • Get the license key from UI Backery Team. You'll get a key like of the following format: eyJhbaj8es9fj9aesI6IkpXVCJ9.eyJsjioOHGEFOJeo0JSe98fJEJSEJFImVtYWlsIjoibmlrLnBvbHRvcmF0c2t5QGdtYWlsLmNvbSJ9.2n9q1LmjnBn62KyAM3FlYZ8PzQcxmIK0_mptNv38ufM

  • Run ./setup.sh:

    • Enter the license key
    • Enter the port (leave empty for local installation, 3030 port will be used)
    • Enter the server URL (leave empty for local installation)
  • Run docker-compose up -d to start the containers

  • Wait until all containers are up and running

  • Open port 3030 or UI_BAKERY_PORT (if it was modified in .env file or entered in ./setup.sh) to access UI Bakery instance, then you can create a new account.

Kubernetes

  1. Clone the repository git clone [email protected]:uibakery/self-hosted.git
  2. Open the kubernetes directory
  3. Edit the ui-bakery-configmap.yaml, and set the required variables inside the {{ ... }}, where:
  • UI_BAKERY_APP_SERVER_NAME - your {server ip address}:3030, for example http://123.123.123.123:3030
  • UI_BAKERY_LICENSE_KEY - get it from UI Bakery team
  • You either have to run a standalone database instance or make sure standard PersistentVolumeClaim exists in your cluster.
  1. Run kubectl apply -f .

Please note that the application will be exposed on a public ip address on port 3030, so DNS and SSL have to be handled by the user.

Azure container instance

  1. Login docker to azure.
docker login azure
  1. Create docker context.
docker context create aci uibakery
  1. Use new context.
docker context use uibakery
  1. Clone ui bakery self-hosted repository.
git clone https://github.com/uibakery/self-hosted.git && cd self-hosted
  1. UI Bakery requires db to persist its data. So we have to create one. We suggest you using Azure Database for MySQL.

  2. Set UI_BAKERY_LICENSE_KEY variable in docker-compose-azure-container-instances.yml for bakery-back service.

UI_BAKERY_LICENSE_KEY=${UI_BAKERY_LICENSE_KEY:-eyJhbGciOiJIUz}
  1. Set UI_BAKERY_DB_* variables in docker-compose-azure-container-instances.yml for bakery-back service.
UI_BAKERY_DB_HOST=${UI_BAKERY_DB_HOST:-azure-container-instance-test-db.mysql.database.azure.com}
UI_BAKERY_DB_PORT=${UI_BAKERY_DB_PORT:-3306}
UI_BAKERY_DB_DATABASE=${UI_BAKERY_DB_DATABASE:-bakery}
UI_BAKERY_DB_USERNAME=${UI_BAKERY_DB_USERNAME:-uibakeryuser@azure-container-instance-db}
UI_BAKERY_DB_PASSWORD=${UI_BAKERY_DB_PASSWORD:-uibakerypassword}
  1. Up azure container instance.
docker compose -f docker-compose-azure-container-instances.yml up
  1. Find assigned IP address. Run docker ps and in colum PORTS you'll find assigned IP address.

  2. Replace all occurrences of UI_BAKERY_APP_SERVER_NAME with the IP address retrieved in the previous step.

UI_BAKERY_APP_SERVER_NAME=https://123.123.123.123
  1. Restart instance to apply new configuration.
docker compose -f docker-compose-azure-container-instances.yml up

Running a standalone database instance

In case when a 3rd party MySQL instance is required:

  1. Create database and user. User must have the following permissions:

        GRANT SELECT, INSERT, UPDATE, DELETE, CREATE, DROP, REFERENCES, INDEX, ALTER, LOCK TABLES, EXECUTE, CREATE ROUTINE, ALTER ROUTINE
  2. Provide the following environment variables:

    UI_BAKERY_DB_HOST=192.168.0.1
    UI_BAKERY_DB_PORT=3306
    UI_BAKERY_DB_DATABASE=bakery
    UI_BAKERY_DB_USERNAME=username
    UI_BAKERY_DB_PASSWORD=password
  3. Run docker-compose -f ./docker-compose-external-db.yml up to start the containers, alternatively, docker-compose -f ./docker-compose-external-db.yml up -d to run containers in the background.

Running on a remote instance

If you would like to run UI Bakery not on localhost, but on a server, you need to provide the following variables:

UI_BAKERY_APP_SERVER_NAME=http://YOUR_DOMAIN_OR_IP:3030
UI_BAKERY_PORT=3030

⚠️ UI_BAKERY_PORT variable must match port in UI_BAKERY_APP_SERVER_NAME variable

In your DNS provider, configure the following records:

  • A or CNAME record with UI Bakery instance host

Then modify your environment variable with the following values:

UI_BAKERY_APP_SERVER_NAME=https://YOUR_DOMAIN
UI_BAKERY_PORT=80

Google SSO

⚠️ This configuration is deprecated. Use SSO with OpenId providers instead.

UI Bakery Google OAuth2 can be done by one setting.

  1. Create OAuth Client ID in Google Developer Console

    • Create or choose an existing project.
    • Click on “Create credentials”.
    • Choose “OAuth Client ID”.
    • Choose “Web Application” Application type.
    • Specify http://localhost:3030 or UI_BAKERY_APP_SERVER_NAME for authorized javascript origin.
    • Specify http://localhost:3030/auth/oauth2/callback or UI_BAKERY_APP_SERVER_NAME/auth/oauth2/callback for authorized redirect URLs.
    • Click “Create”.
    • Copy “Your Client ID”.
  2. Provide UI_BAKERY_GOOGLE_CLIENT_ID=Your Client ID environment variable.

  3. Provide UI_BAKERY_APP_SERVER_NAME=http(s)://youdomain.com environment variable in case you want to run UI Bakery on a custom domain/IP.

SSO with OpenId providers

In your UI Bakery instance, it is possible to configure Single Sign On with a custom OpenID provider that utilizes the Authorization Code Flow.

To set up OAuth2 SSO with UI Bakery, you will need to register the redirect URI in the provider's settings. The redirect URI should be UI_BAKERY_APP_SERVER_NAME/auth/oauth2/callback. In addition, you will need to provide the following variables:

UI_BAKERY_OAUTH_CLIENT_ID=0oa3deycosL4fFEvx5d0
UI_BAKERY_OAUTH_SECRET=sO8BPgTb5MVs9kS37Qoml5sCEK7faFX78VDP2E3q
UI_BAKERY_OAUTH_SCOPE=openid email offline_access profile
UI_BAKERY_OAUTH_AUTH_URL=https://mybakery.okta.com/oauth2/v1/authorize
UI_BAKERY_OAUTH_TOKEN_URL=https://mybakery.okta.com/oauth2/v1/token
UI_BAKERY_OAUTH_USERINFO_URL=https://mybakery.okta.com/oauth2/v1/userinfo
UI_BAKERY_OAUTH_EMAIL_KEY=email
UI_BAKERY_OAUTH_ID_KEY=sub

The SSO user token that is obtained can be used in the HTTP data source configuration to be included in all requests. The token is available as the UI_BAKERY_SSO_TOKEN placeholder. To use the token, you can set up the Authorization header with the value Bearer UI_BAKERY_SSO_TOKEN in the data source configuration. The placeholder UI_BAKERY_SSO_TOKEN will be replaced with the actual token before the request is sent.

To enable token broadcasting, you need to set the following environment variable:

UI_BAKERY_SSO_BROADCAST_TOKEN=true

SSO token refresh

When the OAuth token expires, UI Bakery will try to refresh it under the following conditions:

  • The variable UI_BAKERY_SSO_BROADCAST_TOKEN must be set to true
  • The refresh_token claim must be present
  • The expires_in claim must also be present

If you don't have expires_in in token, UI Bakery will not be able to refresh the token and requests will start to fail. In this case, you can set the variable UI_BAKERY_OAUTH_FORCE_TOKEN_REFRESH to true to force OAuth token refresh on every UI Bakery token refresh attempt. If the token cannot be refreshed and the variableUI_BAKERY_OAUTH_SIGN_OUT_WHEN_TOKEN_EXPIRED is set to true, the user will be logged out from UI Bakery. If you have enabled roles synchronization you can set the variable UI_BAKERY_OAUTH_SYNC_ROLES_ON_TOKEN_REFRESH to true to enable the synchronization on every token refresh.

SAML authentication setup

  1. Configure your Identity provider. In identity provider settings, set Sign on URL and Reply URL to https://APP_LOCATION/api/auth/login/saml. Replace APP_LOCATION with UI Bakery instance URL. Configure name and role attributes. You can set claim name in identity provider settings or in UI Bakery env variables UI_BAKERY_SSO_NAME_CLAIM and UI_BAKERY_SSO_ROLE_CLAIM.

  2. Provide URL of your identity provider metadata and entity ID via the following env variables:

    UI_BAKERY_SAML_METADATA_URL=https://your.identityprovider.com/federationmetadata/2007-06/federationmetadata.xml.
    UI_BAKERY_SAML_ENTITY_ID=http://appregestry.com/myapp/primary
  3. Set variable UI_BAKERY_SAML_ENABLED=true

SSO roles synchronization

By default, UI Bakery will not sync any roles provided by the Identity Provider.

  1. To enable roles synchronization, set the variable UI_BAKERY_SSO_SYNC_ROLES=true. Out of the box, UI Bakery will try to match received roles by names. Roles sync will be done only during the sign up process. If a match is found (e.g. SSO returned a support role and UI Bakery has this role in the workspace), current user roles will be deleted and the matched SSO role(s) will be assinged to the user.

    ⚠️ During user sign up, a default user role will be assigned unless UI_BAKERY_SSO_HARD_SYNC_ROLES is enabled.

    ⚠️ If no match is found, UI Bakery will leave the current user roles. See UI_BAKERY_SSO_HARD_SYNC_ROLES to change this behaviour.

  2. Additionally, you can configure a role mapping from identity provider role id/name to a UI Bakery role:

    UI_BAKERY_SSO_ROLE_MAPPING=identityRoleName->bakeryRoleName,identityRoleName2->bakeryRoleName2
  3. If your setup requires a complete syncronization, when UI Bakery overwrites all roles, removing existing ones and adding new ones received from Identity Provider even if SSO returns no matching roles (e.g. user has no access to the system), use the following variable:

     UI_BAKERY_SSO_HARD_SYNC_ROLES=true

    ⚠️ Please note, if no roles are found, the user will be removed from the organization and will no longer be able to access it.

  4. To sync roles during the login as well, set UI_BAKERY_SSO_SYNC_ROLES_ON_LOGIN=true

  5. By default, UI Bakery will only sync roles for end-users, leaving the admin and editor roles untouched. To sync roles for all users, set UI_BAKERY_SSO_SYNC_ROLES_FOR_EDITOR_AND_ADMIN=true

    ⚠️ Please note, this way admin accounts may lose the access to the system in a case of malformed configuration.

Other authentication setting

  1. You can set the variable UI_BAKERY_SSO_LOGIN_AUTO to true to enable automatic login. Any unauthorized user will be redirected to SSO login flow.

  2. You can disable email authentication by providing the environment variable UI_BAKERY_EMAIL_AUTH_ENABLED=false

  3. Provide UI_BAKERY_AUTH_RESTRICTED_DOMAIN=domain.com environment variable to restrict Google login only to the specified domain.

Embedding

UI Bakery self-hosted can be easily embedded in other web applications and pages. It is also possible to setup two-way communitcation between embedded app and website the app is embedded in.

Before you proceed, make sure that UI_BAKERY_EMBEDDED_ENABLE_ACTIONS_EXECUTION=true variable is enabled in your instance.

  1. Embed UI Bakery in an iframe where src is a link to an Embedded UI Bakery application (e.g. https://custom-uibakery.com/share/SKDUFYUDF)
<script src="https://custom-uibakery.com/uibakery-embedded.js"></script>
<iframe width="100%" height="50%" id="uibakery" src="https://custom-uibakery.com/share/SKDUFYUDF"></iframe>
  1. Add a script tag to the page where UI Bakery app is embedded to communicate with internal app actions:
<input type="number" value="10" />
<button>Execute Action</button>

<script>
  const bakery = UIBakery('#uibakery');
  bakery.onReady(() => {
    document.querySelector('button').addEventListener('click', () => {
      const limit = parseInt(document.querySelector('input').value, 10);

      // execute UI Bakery action with {{params}} = { limit: 10 }
      bakery.triggerAction('actionName', { limit });
    });

    // listen to messages sent from UI Bakery
    bakery.onMessage('eventName', params => {
      console.log(params);
    });
  });
</script>

Listen to messages from UI Bakery in the host app

To listen to messages from UI Bakery, use the bakery.onMessage('eventName') method:

  • In your host app, listen to a message from a UI Bakery app:
bakery.onReady(() => {
  //...

  bakery.onMessage('eventName', params => {
    console.log(params);
  });
});
  • In the UI Bakery app, send the message (for example, in an Action code) so that it can be received by the host app.
UIBakeryEmbedded.emitMessage('eventName', {{data}})	;

Send a message from the host app to UI Bakery

To send a message from the host app to UI Bakery, use bakery.triggerAction('actionName', { ... }); method. This method triggers a specific action and passes the second argument as a {{params}} variable:

  • In your host app, trigger an action with the custom params:
bakery.onReady(() => {
  //...
  bakery.triggerAction('setUser', { user: '[email protected]' });
});
  • In the UI Bakery app, create the 'setUser' action and use {{params}} variable to receive the data:
// ... setUser action
console.log({{params.user}});

return {{params.user}}

Limitations

  • Emails won’t be sent from the local instance, although the invitation system works in a way that any invited email can access the organization by creating an account.

  • Google Sheets connection requires additional setup.

Google Sheets connection setup

Start with creating OAuth Client ID in Google Developer Console. Then, follow the below steps:

  1. Create a new or choose an existing project.
  2. Go to API & Services section.
  3. Click ENABLE APIS AND SERVICES and enable Google Sheets API.
  4. Click on Create credentials and choose Create OAuth client ID.
  5. Select Web Application.
  6. Add Authorized redirect URI with value http://YOUR_IP_OR_DOMAIN/gsheet-oauth-callback
  7. Click Create.
  8. Set credentials in UI_BAKERY_GSHEET_CLIENT_ID and UI_BAKERY_GSHEET_CLIENT_SECRET variables.
  9. Go to OAuth consent screen and create it with an external type.
  10. Publish your consent screen.

Salesforce connection setup

Prerequisites

  • A Salesforce account

Setting up the connection

  1. In Salesforce, navigate to the "App Manager" section and create a new connected app. Enter the name and contact information for the app.
  2. Enable OAuth settings and enter the callback URL http(s)://YOUR_UIBAKERY_IP_OR_DOMAIN/salesforce-oauth-callback.
  3. In the "Selected OAuth Scopes" section, add all the necessary OAuth scopes. Make sure to include access and manage your data and perform requests on your behalf at any time. Even though Full access is an option, it's important to note that it doesn't grant all the necessary permissions.
  4. Save the connected app and make note of the Consumer Key (Client ID) and Consumer Secret (Client Secret).
  5. Save Client ID and Client Secret to the UI_BAKERY_SALESFORCE_CLIENT_ID and UI_BAKERY_SALESFORCE_CLIENT_SECRET environment variables and restart docker container.
  6. In UI Bakery, create a new Salesforce datasource and enter the Salesforce URL.
  7. Test the connection to ensure it is successful.

Troubleshooting

  • If you encounter an error message when testing the connection, double-check that the callback URL and OAuth scopes are correctly configured in Salesforce.
  • Make sure your Salesforce instance URL ends in .salesforce.com
  • Make sure that the correct permissions are granted to the connected app

Configuring email provider

By default, UI Bakery On-Premise comes with a noop email provider that will only log emails to the backend logs.

Configure Sendgrid

We suggest using Sendgrid email provider to send the emails:

  1. Create a Sendgrid account or use an existing account

  2. Generate an API Key with the Mail Send access enabled

  3. Set the following environment variables:

    UI_BAKERY_MAILING_PROVIDER=sendgrid
    SENDGRID_API_KEY=YOUR_API_KEY
    [email protected] # is used for welcome email
    [email protected] # is used for other system emails like invitation, reset password and email change
    # make sure this domain is authorized to send emails in your sendgrid account
  4. Restart the containers.

Once configured, your instance will start using your account to send the user invitation, password reset, and other emails.

Change email templates

By default, email templates and subjects are provided as environment variables, so you can adjust the emails by modifying their content:

# tells that email will be sent as plain text/html
UI_BAKERY_MAILING_TEMPLATES_MODE=custom

UI_BAKERY_MAILING_WELCOME_TEMPLATE=Hello userName,<br> Welcome to UI Bakery workspace.
UI_BAKERY_MAILING_WELCOME_SUBJECT=Welcome to UI Bakery workspace

UI_BAKERY_MAILING_RESET_PASSWORD_TEMPLATE=Hello userName,<br> Here's your <a href="resetPasswordUrl">password reset link</a>.
UI_BAKERY_MAILING_RESET_PASSWORD_SUBJECT=Reset password request

UI_BAKERY_MAILING_CONFIRM_EMAIL_CHANGE_TEMPLATE=Hello userName,<br> Here's a link <a href="changeEmailUrl">to change your email</a>.
UI_BAKERY_MAILING_CONFIRM_EMAIL_CHANGE_SUBJECT=Change email request

UI_BAKERY_MAILING_SHARE_WITH_USER_TEMPLATE=Hello userName,<br> Here's a <a href="organizationUrl">link to access the organizationName workspace</a>.
UI_BAKERY_MAILING_SHARE_WITH_USER_SUBJECT=You are invited to UI Bakery workspace

You can use the following built-in email variables to add user values to your emails:

# All emails
userName, userEmail, subject, userId

# Reset password request
resetPasswordUrl

# Invitation email
organizationUrl, organizationName

# Change email request
changeEmailUrl

Alternatively, you can set up email temples using SendGrid dynamic templates and put template ids instead of plain HTML emails:

# tells that email will be sent using dynamic templates
UI_BAKERY_MAILING_TEMPLATES_MODE=provided

UI_BAKERY_MAILING_WELCOME_TEMPLATE=d-c3f84d76543941c084ff2de0exxxxxxx
UI_BAKERY_MAILING_RESET_PASSWORD_TEMPLATE=d-c3f84d76543941c084ff2de0exxxxxxx
UI_BAKERY_MAILING_CONFIRM_EMAIL_CHANGE_TEMPLATE=d-c3f84d76543941c084ff2de0exxxxxxx
UI_BAKERY_MAILING_SHARE_WITH_USER_TEMPLATE=d-c3f84d76543941c084ff2de0exxxxxxx

⚠️ Note, that in this case an email subject will be taken from a dynamic template configuration and variables such as UI_BAKERY_MAILING_WELCOME_SUBJECT will be ignored.

This way, you don't need to manage templates content inside of your environment variables and can build more advanced email with images and custom styles.

Branding

To make UI Bakery feel like a part of your own systems, you can do some branding:

  • Change the title of the app in the browser tab:
UI_BAKERY_APP_TITLE=UI Bakery
  • Replace the UI Bakery logo with your own logo on the login screens:
UI_BAKERY_BRANDING_LOGO_URL=https://cloud.uibakery.io/assets/logo.svg
  • Change the background image on all login screens:
UI_BAKERY_BRANDING_AUTH_BACKGROUND_URL=https://cloud.uibakery.io/assets/auth-background.webp
  • Use a custom loader as an inline SVG with the class="loader-logo":
UI_BAKERY_BRANDING_LOADER='<?xml version="1.0" encoding="UTF-8"?>
<svg class="loader-logo" viewBox="0 0 27 39" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<defs>
<path id="a" d="m14.266 30.487c-2.943 0.552-5.771-1.41-6.317-4.381-0.546-2.972 1.396-5.828 4.338-6.38 2.943-0.552 5.77 1.41 6.317 4.382 0.547 2.971-1.396 5.827-4.338 6.379m10.56-11.99c-3.616-6.441-11.716-8.704-18.095-5.053-6.379 3.65-8.619 11.83-5.004 18.272 3.615 6.441 11.715 8.704 18.093 5.054s8.619-11.832 5.004-18.273"/>
</defs>
</svg>'
  • Customize the loader container's styles with inline CSS:
UI_BAKERY_BRANDING_LOADER_STYLES="background: #003D4C; transform: scale(2)"
  • Change the website's favicon:
UI_BAKERY_BRANDING_FAVICON=https://www.merits.com/hubfs/favicon-96.png
  • Customize the logo at the top left corner of the workspace:
UI_BAKERY_BRANDING_MENU_LOGO_URL=https://cloud.uibakery.io/assets/logo.svg

Other more specific branding settings are also available, check Branding environment variables.

Updating on-premise version

Once an update to the on-premise version is available, we will notify you via email.

Update to the latest version

To update your UI Bakery on-premise version to the latest one, follow the steps below:

  1. Take a full backup of UI Bakery instance.
  2. Go to your ui-bakery-on-premise folder:
cd ./ui-bakery-on-premise
  1. Run ./update.sh that will download new images and restart your instance:
./update.sh

Update to the specific version

To update your UI Bakery on-premise version to the specific version, follow the steps below:

  1. Take a full backup of UI Bakery instance.
  2. Go to your ui-bakery-on-premise folder:
cd ./ui-bakery-on-premise
  1. Open the docker-compose.yml file and replace the versions for all images with the specific version desired. For example, to update to version 3.0.0, the following changes should be made:
version: "3.9"
services:
  bakery-gateway:
    container_name: gateway
    depends_on:
      - "bakery-front"
      - "workbench-front"
      - "bakery-back"
-    image: cruibakeryonprem.azurecr.io/cloud/gateway:latest
+    image: cruibakeryonprem.azurecr.io/cloud/gateway:3.0.0
    restart: always
    env_file: .env
    ports:
      - "${UI_BAKERY_PORT:-3030}:3030"

  bakery-front:
    container_name: bakery-front
-    image: cruibakeryonprem.azurecr.io/cloud/bakery-front:latest
+    image: cruibakeryonprem.azurecr.io/cloud/bakery-front:3.0.0
    restart: always
    env_file: .env

  workbench-front:
    container_name: workbench-front
-    image: cruibakeryonprem.azurecr.io/cloud/workbench-front:latest
+    image: cruibakeryonprem.azurecr.io/cloud/workbench-front:3.0.0
    restart: always
    env_file: .env

  datasource:
    container_name: datasource
-    image: cruibakeryonprem.azurecr.io/cloud/datasource:latest
+    image: cruibakeryonprem.azurecr.io/cloud/datasource:3.0.0
    restart: always
    env_file: .env

  bakery-back:
    container_name: bakery-back
    depends_on:
      db:
        condition: service_healthy
-    image: cruibakeryonprem.azurecr.io/cloud/bakery-back:latest
+    image: cruibakeryonprem.azurecr.io/cloud/bakery-back:3.0.0
    restart: always
    env_file: .env

  automation:
    container_name: automation
-    image: cruibakeryonprem.azurecr.io/cloud/automation:latest
+    image: cruibakeryonprem.azurecr.io/cloud/automation:3.0.0
    restart: always
    env_file: .env
  1. Then restart the system
docker-compose down
docker-compose up -d

How to update licence key

To update your UI Bakery licence key, you need to change the corresponding variable:

UI_BAKERY_LICENSE_KEY=key_value

For docker-compose setup, the environment variables are located in ui-bakery-on-premise/.env file. To restart your instance, use the following command:

docker-compose down
docker-compose up -d

UI Bakery in production

UI Bakery installation is ready for production out of the box. However, there is a bunch of additional setup steps we recommend following:

  • Put your instance behind HTTPS.
  • Use a standalone database.
  • Enable automatic backups for instance and database machines.
  • Store your environment variables in a secure place like secrets manager or key vault.

Make sure you override the following variables:

UI_BAKERY_JWT_SECRET
UI_BAKERY_JWT_REFRESH_SECRET
UI_BAKERY_JWT_SERVICE_ACCOUNT_SECRET
UI_BAKERY_CREDENTIALS_SECRET

If you have used install script, then your .env file already contains unique values for those vars. Otherwise, you can generate values for these variables with the script:

echo "'$(LC_ALL=C tr -cd "A-Za-z0-9_\!\@\#\$\%\^\&\*\(\)\\-+=" < /dev/urandom | head -c 32 | xargs -0)'"

You can set the following environment variables to limit resource consumption (MB):

JAVA_OPTS=-Xmx1024m
NODE_OPTS=--max-old-space-size=1024

You can estimate memory size for both variables with the below multiplying:

S - request size in MB
T - time required to process request
N - number of concurent requests 

MEMORY_NEEDED=S*T*N

Setting up SSL

The guide on how to set up SSL for UI Bakery on Ubuntu could be found here.

Health check API

The health check API that can be accessed at the endpoint /api/actuator/health. This API endpoint can be used to verify the overall health of the software application, including its dependencies and resources.