Skip to content

DA App SDK

Chris Millar edited this page Jun 27, 2024 · 12 revisions

The Dark Alley App SDK allows you to work with protected Dark Alley content. This allows you to build fully authenticated custom apps for your creators when you have a special use case Dark Alley does not cover out of the box.

Supported experiences

  1. Fullscreen apps
  2. Library add-ons - (coming soon)

Getting Started

You will need

  1. A site - ex: https://main--geometrixx--aemsites.aem.live
  2. A page - ex: https://main--geometrixx--aemsites.aem.live/tools/tags.html
  3. An app - ex: https://main--geometrixx--aemsites.aem.live/tools/tags/tags.js

TLDR Code

/tools/tags.html

<!DOCTYPE html>
<html>
  <head>
    <title>DA App SDK Sample</title>
    <meta name="viewport" content="width=device-width, initial-scale=1"/>
    <link rel="icon" href="data:,">
    <!-- Import DA App SDK -->
    <script src="https://da.live/nx/utils/sdk.js" type="module"></script>
    <!-- Project App Logic -->
    <script src="/tools/tags/tags.js" type="module"></script>
  </head>
  <body>
  </body>
</html>

/tools/tags/tags.js

// Import SDK
import DA_SDK from 'https://da.live/nx/utils/sdk.js';

// Import Web Component
import './tag-browser.js';

(async function init() {
  const { project, token } = await DA_SDK;
  const tagBrowser = document.createElement('da-tag-browser');
  tagBrowser.project = project;
  tagBrowser.token = token;
  document.body.append(tagBrowser);
}());

Visit your app on da.live

Visit: https://da.live/apps/custom/aemsites/geometrixx/{branch-name}/tools/tags

For local development, you can use a branch name of local which will send requests to http://localhost:3000.

Clone this wiki locally