Edit in GitHubLog an issue

Architecture Overview

Types of App Builder apps#

An App Builder Application is a serverless application that extends Adobe Product APIs. These applications can be one of two kinds: headless or headful. Each of these types is described in more detail in the sections that follow.

Headless Application#

In a headless application, the application consists of a set of serverless actions and/or sequences deployed to Runtime, Adobe's serverless platform.

A typical headless application would integrate well with a remote script or process that invokes it, such as an AEM Assets workflow or an ACS activity.

Headful Application#

A headful application is a Single Page Application (SPA) with a full-fledged user interface (UI) served from the out-of-the-box Content Delivery Network. This type of application calls Adobe Product APIs directly from the client when applicable. When there is a strong need to orchestrate Adobe Product API calls with 3rd party API calls, or with Adobe Identity Management System for authentication purposes, you can deploy serverless actions and/or sequences using Runtime.

JAMStack: Anatomy of an App Builder App#

App Builder apps that are Single Page Applications with a full-fledged UI should follow the JAMStack Architecture.

The three main components of App Builder apps are:

JAMStack Architecture

SDK Components#

CLI#

The CLI is one of the main touchpoints for App Builder developers. It is based on oclif, which is a popular framework to build extensible command line tools.

The CLI comes out-of-the-box with the following capabilities:

App Builder Generators#

The generators help developers to bootstrap their App Builder apps when using the CLI.

Generators can be used to create:

SDK Libraries#

App Builder also provides a collection of JavaScript-based SDK libraries designed to increase the developer's velocity when implementing Custom Applications on top of Adobe APIs.

Main SDK library#

The main SDK library bundles smaller, reusable SDK libraries serving a variety of use-cases:

Integration with Adobe APIs#
Integration with Adobe's Identity Management System#

The Adobe IMS SDK library provides authentication management capabilities to Adobe's Identity Management Services, for both of the following scenarios:

Integration with additional out-of-the-box services#
  • The Files SDK provides a file system-like abstraction on top of an out-of-the-box cloud storage to store large, temporary files.
  • The State SDK provides a state-like abstraction on top of an out-of-the-box cloud-based key-value store.
Technical framework for developers#

The Core SDK library bundled into the main SDK library provides a lower-level technical framework for developers.

This framework must be used when contributing to the App Builder SDK. It is also recommended to use it when building an App Builder application.

Core SDK library#

The Core SDK library enables developers with the following technical capabilities:

Configuration#

The Configuration SDK library allows management of persistent and environment variable configuration.

Logging#

The Logging SDK library provides a logger abstraction that can be used in SDK libraries and serverless actions deployed to Runtime.

Errors#

The Errors SDK library is the base implementation for all errors thrown by the SDK libraries and can be used by developers to manage their own errors.

Networking#

The Networking SDK library provides low-level networking tools such as exponential back-off that can be used in SDK libraries and custom API clients.

Token-Vending Machine#

The Token-Vending Machine is exposed as an out-of-the-box API deployed to Runtime.

It enables developers to perform the following actions on behalf of their App Builder application credentials:

  • Deploy the web assets of their App Builder application to the out-of-the-box CDN.
  • Use the out-of-the-box cloud storage through the Files SDK.
  • Use the out-of-the-box key-value store through the State SDK.

CI/CD Support#

The out-of-the-box CI/CD support for App Builder Applications consists in:

Webpack#

App Builder uses Webpack for bundling I/O Runtime action code. See here for an overview on webpack configuration.

Migration Guides#

  • Standalone Application to DX Experience Cloud SPA v1 - Migrate an App Builder application that's been initialized as a Standalone Application to a DX Experience Cloud SPA v1. Useful if you can't seem to view your application in the App Builder Catalog in Adobe Experience Cloud.

Next steps

  • Privacy
  • Terms of Use
  • Do not sell my personal information
  • AdChoices
Copyright © 2022 Adobe. All rights reserved.