Introduction

What is Canopie?

Canopie is a Super App engine that consists of a collection of APIs, SDKs, tools and relevant software that enable the creation of an entire ecosystem/marketplace. Canopie services can be deployed on premise or to public cloud. Services provide RESTful APIs and can be white labelled on the UI. This is to help accelerate third party development and bring value to the platform instead of dealing with the plumbing and building an entire marketplace from scratch.

What is a Super App?

A Super App is a mobile application that has the ability to run other apps inside them. These "Mini Apps" are discreet functionality that are created independently by other developers of the same company or even external third parties to achieve better scalability.

You can think of the main host app as a shopping mall. The mall leases out space to other shops. These are the Mini Apps. They each have their own independent business models and provide goods and services to the people coming into the shopping mall. The shopping mall provides people, security, parking and common utilities so that the shops can focus on providing value to the customer.

Technically, Super Apps are mobile applications on either iOS or Android that have their own marketplace or "Mini Apps" inside them. Mini Apps are usually served through a webview and have a specialized subset of HTML and Javascript as its own Domain specific language (DSL). Mini Apps have their own load and unload life cycles and provide extra value to the end user by leveraging the assets of the host Super App.

For a developer perspective on building Mini Apps, read on. For enterprise customers, head to the enterprise section for more details.

General Flow

Let's break this down step by step.

Creating the Invite Code and Sending it to Developers (Steps 1 and 2)

Organizations want to manage invitation campaigns and potentially limit the number of sign ups to the platform. Especially when they are deploying a new ecosystem like Canopie. Canopie gives organizations the ability to track and manage the number of developers signing up via a unique, human readable invitation code.

This also gives developers that already have an account with Canopie be able to join more than one organization that use Canopie also. This process is more streamlined and you don't need to create multiple developer accounts.

The first two steps provide this capability. As a developer, if you're wondering if you could deploy your Mini App across more than one organization's Super App, your guess is correct! Just make sure that you cater for custom SDK calls if each ecosystem has a custom SDK. More on that later.

Registering and Creating Mini Apps (Steps 3 and 4)

Developers, whether they are individuals or organizations need to register on Canopie. Organizations need to know who you are and verify your identity to ensure that they know who they're talking to and can help you through the process if your app gets rejected due to a guideline issue. Make sure to provide the correct invitation code so that you get associated with the organization.

Using Canopie markup and JavaScript, you can create Mini Apps. Canopie comes pre-loaded with an SDK and Material UI style so that you don't need to build anything from scratch.

Example Canopie Code

CPML

{{ 
  items.map((item, idx) => cpml`
    <list-item id='item-{{idx}}'>
      <view class='content'>
        <text class='primary-content'>{{item.name}}, {{item.price}}</text>
      </view>
    </list-item>
  `) 
}}

JavaScript

Page({
  data: {
    items: [
      {
        name: 'Apple',
        price: 1.50
      },
      {
        name: 'Durian',
        price: 40.00
      }
    ]
  }
});

This example code loops through the items list and renders a <text> element for each item based on the template.

On the JavaScript side, the data is pre-loaded for the Page that will be loaded for the Mini App. It pre-populates the items variable with a json structure.

This terminology, examples of Canopie markup and JavaScript will be further explained in the next sections.

On the Developer portal itself, you need to "create" the Mini App and fill in its details. You'll then get a link to

Note: Canopie is currently in Alpha and not yet making these tools public. A Visual Studio Code plug-in is also coming soon.

Submitting and Publishing (Steps 5 to 8)

When you're done and happy with the Mini App. Hop onto the Developer Portal to see your builds. Submit one of those builds to get it reviewed.

The reviewer in the organization will take a look, launch, test and read the description of your Mini App. They need to ensure that your Mini App follows their organization guidelines and that it provides good value to the end user.

If everything is good, the reviewer accepts the submission and you then have the option of publishing it into production. The Mini Apps get deployed to a CDN and produce a QR code for users on the Super App to scan and launch.