Code Labs

Code Labs are guided hands-on coding experiences to build apps on top of App Builder. An estimate of time to complete is shown for each.

Tech tutorials

data-slots=heading, link, text

data-width=100%

Spectrum introduction

Start (20 min)
Introduction to Spectrum to build an App Builder App UI.
data-slots=heading, link, text

data-width=100%

Consume events using Journaling API

Start (30 min)
Creating cron jobs in an App Builder application to consume events using Journaling API.
data-slots=heading, link, text

data-width=100%

Event-Driven App Builder apps

Start (25 min)
Introduction to applying Custom I/O Events in event-driven use cases of App Builder applications.
data-slots=heading, link, text

data-width=100%

Events using Runtime Actions as webhook

Start (30 min)
How to consume I/O Events using I/O Runtime actions as webhook.
data-slots=heading, link, text

data-width=100%

CI/CD in App Builder apps

Start (15 min)
Setting up CI/CD for an App Builder App using GitHub Actions.
data-slots=heading, link, text

data-width=100%

Debugging App Builder apps

Start (25 min)
The basic steps of debugging an App Builder App.
data-slots=heading, link, text

data-width=100%

Scheduling cron jobs

Start (20 min)
Creating cron jobs in an App Builder app using OpenWhisk Alarms Package.

App tutorials

data-slots=heading, link, text

data-width=100%

App Builder headless app

Start (30 min)
Creating a Headless App using App Builder to render a barcode with dynamic data.
data-slots=heading, link, text

data-width=100%

Asset compute worker with Photoshop APIs

Start (40 min)
Building asset compute workers using Photoshop APIs to generate custom renditions in AEM.
data-slots=heading, link, text

data-width=100%

Building an App Builder To-Do app

Start (30 min)
How to build a To-do App with App Builder using aio-lib-state as storage library and React Spectrum components.
data-slots=heading, link, text

data-width=100%

Customer profiles dashboard

Start (1 h)
Creating a dashboard of customer profiles from Adobe Campaign Standard using App Builder.
data-slots=heading, link, text

data-width=100%

Custom Asset compute worker

Start (20 min)
Building a Custom Asset Compute Worker using third-party services to generate intelligent renditions in AEM.
data-slots=heading, link, text

data-width=100%

Build an app that consumes Adobe Experience Manager events

Start (30 min)
Learn why is it a good idea to build event-driven applications and how to build them with ease using App Builder.

Next step

Return to App Builder Overview.