Skip to main content
Version: Next

UI and Service Apps

There are two types of applications in DRAW:

  • UI App: UI Apps are frontend applications with a user interface. These run on a device which has a screen (smartphone, tablet, laptop). UI Apps run in web browsers or can be wrapped in e.g. Electron.

  • Service App: Service Apps are backend applications which don't have a user interface and will run on a device which don't have a screen (a server, an IoT device). They run on top of node.js.

UI App

The UI Application brick can be drag-and-dropped from the Project Editor’s Marketplace. By default, an UI Application automatically gets a Home screen.

All available Screens can be drag-and-dropped from the Marketplace into the Project Editor and they are part of the UI design of the application.

The App can be opened and tested by running it on a smartphone/tablet or in a new tab using the UI App contextual menu items Share or Run in browser.

Screenflow editor

The Screenflow Editor provides a way to create and edit all the Screens used in an App or in a screen, together with their interaction way through transitions defined between the Screens.

Here, the user can define which is the initial screen, known as the Home screen, represented by the blue play button and create transitions between Screens by using the Create transition arrow. Editing an existing transition can be done from the yellow arrow, which will point to the Screen sub-editor. If a transition was defined as a UI action in a Screen, the referenced screen and the transition are automatically reflected in the screenflow.

The App can be opened either in a new tab, either by scanning the QR code with a smartphone/tablet from the upper-right buttons Open App in new tab or Share App. If the App is running, any modifications done in the UI App Editor are reflected real-time in the opened App on the device.

Properties editor

An On load action can be defined. It is triggered when the application starts. One typical use it to set the Theme of an application.

Service Apps, Services and Remote Actions

Service Apps are created from the Project’s Editor Marketplace.

Service apps can run two types of services: Services, and Remote Actions.

service_apps

Services

Services are long running tasks. They are started when the Service App is launched, and run until the Service App is stopped. Services are typically used to:

  • Listen to incoming emails
  • Run batch jobs
  • Expose REST APIs
  • Synchronize cloud applications
  • Send notifications when something happens in another system
  • Run scheduled tasks
  • ...

Remote Actions

Remote Actions are triggered when called and completes after outputting all results. They are typically called by UI Apps (or by other Service Apps) to trigger an action that must run on a backend for security or performance reasons. Remote Actions can typically be used to:

  • Send emails or notifications
  • Call REST APIs using secure API keys, certificates or other authentication mechanisms
  • Access databases, file shares, blob storage or other restricted services
  • ...

Within DRAW, remote actions are used like any other action. During execution however, the inputs of the remote action are serialized, sent to the Service App running that remote action, which executes the content of the remote action, and outputs are serialized back to the caller.

Remote actions are synchronous. They can however be used to implement asynchronous patterns. For example, one could have one remote action which starts a process and returns a handle, and another remote action which uses that handle and checks whether the process is completed or not.

Running a Service App

A single Service App can host multiple services and remote actions. It is also possible for a single service or remote action to be used within multiple service apps. For example:

  • Service App 1 runs the Send Email, Create Ticket in ServiceNow and Create RFQ in SAP Ariba remote actions
  • Service App 2 runs Send Email and Create Ticket in ServiceNow

Such configurations are typically useful for

  • A developer creates a single Service App running the services and remote actions she is working on, and runs that service app locally on her laptop.
  • For simplicty, the dev environment has one service app running all services. In preprod and production however, one may have one service app which is deployed on premise to be close to data sources, while another service app runs standard services, e.g. to send emails.
  • If multiple projects are being developed on the same dev environment, services could be mutualized into a single service app. When the projects are deployed to dedicated environments in prod for instance, they may need one service app per project.

The Service App can be run from the editor by clicking on the Play button, or by selecting Run in browser from the context menu in the folder editor. This is mostly useful to understand the concepts without leaving DRAW. Once going into integration scenarios, it is necessary to actually run the Service App within a node.js process to have full flexibility. Steps to do so can be found in the [local install guide](1_guides/tooling/00_CODE_Community_install#Run a backend).