Apex Designer Technical Overview
Apex Designer is a low code app builder that is used to design modern web applications and micro services. Users model business objects, processes, user interfaces and business logic using Apex Designer. This representation of the application (or metadata) is used to generate a set of source code files. By default, the generated code includes only open source libraries and so there are no run-time licensing requirements.
Application Development Process
Application Design
Apex Designer users use visual models with type-ahead and other assists to design the desired application, including information models, process models, user experiences and server-side behaviors. The application code can be generated incrementally as changes are made. Apex Designer has native branch capabilities, allowing multiple team members to work on the same artifacts at the same time with fine-grained tools for merging changes back into the master.
Build Time
Apex Designer generates client-side source files for an Angular single page web app (SPA) using configurable templates. It generates server-side source files for a Node.js back end using the Loopback framework. To date all projects have been built in Angular, but React templates are in development and initial testing is complete.
Libraries
Apex Designer comes with a selection of libraries containing design artifacts for application generation as well as capabilities such as authentication, integration to external systems like Salesforce or Box, SMS and email messaging, and many others. Users can create custom libraries to share capabilities across multiple projects and maintain standards. Open source libraries from npmjs.org (the worlds largest open source software library) can be included in applications in a single click, and many capabilities can quickly be added in this way.
App Manager
App Manager is the build/run environment used during development of an Apex Designer app. Each app (and branch of an app) has an App Manager. App Manager retrieves the generated source files from Apex Designer, builds the client and server apps, runs the app and provides access to logs. App Managers are provisioned on the cloud by default but they can also be run locally or on an on-premises server.
Application Databases
By default, generated applications use a Postgresql database for persistence. Loopback 4 supports all major database flavors as well as other connectors such as REST and SOAP. Generating the application automatically updates the schema of the database to support the information model defined. Additional views and indexes can be added as needed via the Apex Designer client.
Application Authentication
Generated applications have basic authentication (email and password) managed within the application, but can be easily integrated with a third party identity provider. Our default is Auth0 but Active Directory, Ping and others have also been used.
Process Modeling with Camunda
Apex Designer has integrated process modeling which pushes process definitions to Camunda for execution in the Camunda process engine. Apex has a specific build of Camunda that includes a multi-tenant pattern with Auth0 machine to machine authentication so that each app and branch of the app can run without disturbing the other apps and branches.
Source Control / CICD
Apex Designer pushes metadata and generated source files to Git (including specific branches if needed). Automated build and deployment pipelines have been developed using several different technologies. Client-side and server-side files can be packaged as a Docker image and checked into a container repository for deployment.
Extensibility
The code generation templates in Apex Designer are content in a library and as such can be modified if different standards for implementation are desired. Custom server side behaviors and endpoints can be built. These require some typescript capabilities but wherever code is required in Apex Designer, the Monaco editor plug-in is used for error checking and formatting. Any generated file in Apex Designer can be overridden to allow a customized implementation. This means applications are not restricted from using any capability of Node/Angular.
Mobile Devices
Angular incorporates responsive design features for making applications function on any screen size. Progressive Web Apps (PWA) can be generated to give a more native app-like experience on mobile devices.
Application Security
Apex Designer generates applications that are based on Angular on the client side and Loopback APIs / node.js on the server side. IBM includes security best practices in the Loopback framework as well as recommendations for applications built using it. Here are a few examples of how the applications are secure.
SQL Injection
Loopback uses Loopback Connectors to access relational databases safely using parameterized queries to avoid SQL injection.
Authentication
Authentication can be handled by external services (i.e. Auth0, Ping), on-prem SSO, or the built in user management in Loopback. In all cases, the access token has an application-specified expiration. Access tokens can be secured using cookies that are domain specific, http-only and signed to prevent modifications. They can also be managed in JSON Web Tokens and local storage.
Sensitive Data Exposure
The Loopback framework includes capabilities to remove sensitive data from responses so that it is never transferred from the server to the client. There are also capabilities to encrypt data before going to the database and decrypt it on the way back. If the load balancer does not handle automatic redirects to HTTPS, logic in the Loopback server can do that automatically. Passwords managed by the Loopback user management are encrypted using bcrypt.
JSON Payloads
Loopback APIs use JSON-based payloads by default. This eliminates the risk caused by xml external entities references.
Access Control
The Loopback framework provides integrated access control that can be configured by the application in many ways. Users are assigned roles and roles have specified access levels for models (Products for example) or specified methods (create Product for example). There are also numerous patterns to controlling access to subsets of objects (my orders for example).
Security Configuration
Apex Designer apps should be run on servers that are configured properly (certificates, etc). In addition, the Loopback framework supports production builds that hide server-side error messages. The Loopback framework is continuously updated to address any vulnerabilities that are discovered.
Cross-Site Scripting (XSS)
The Loopback framework leverages the Helmet xssFilter, frameguard, and many others. These are configurable on an application by application basis. Angular also helps with XSS by treating all values as untrusted by default and providing sanitizers to apply the appropriate level of trust to user entered values when applicable.
NPM Package Vulnerability Checking
The client-side and server-side application dependencies are installed using NPM. NPM automatically checks for package vulnerabilities and provides information on how to correct them.
Logging and Event Patterns
Application logs can be streamed to log analysis tools. Events can be published to Slack or other notification systems.
Application Performance
