General

A SCAYLE Panel Add-on enables developer teams to integrate with the SCAYLE Panel and extend its functionality. Add-ons are developed and deployed independently and can be managed in the SCAYLE Panel (see "Write your first Add-on" of the User Manual for further information).

This guide:

Provides a demo Add-on
Outlines configuration and authentication in the SCAYLE Panel
Covers usage of the Add-on API

This page explains how Add-ons fit into SCAYLE. The following pages go into details how the infrastructure and tech stack are set up and the different types of apps you can build.

How Add-ons Fit into SCAYLE

Add-ons allow you to expand the SCAYLE Panel beyond the core system. You can build on existing processes (e.g., user handling, report engines, APIs) and integrate your own tools and systems into the look and feel of the SCAYLE Panel. This ensures users/employees, for instance, no longer have to switch between different applications.

The Add-on UI is written as a micro frontend, utilizing the single-spa framework. They can be written in the JavaScript framework of your choice. However, we recommend using Vue 3. This will also allow you to utilize the SCAYLE Panel style component library, assuring the look and feel of your Add-on matches the rest of the SCAYLE Panel. You can find out more about the concept of micro frontends at single-spa.js.org.

For a more complex Add-on, you probably add your own Backend application. That can be useful if you need to store data in your own database, or communicate with other API services.

Example Uses Cases

Some possible ways to extend the SCAYLE Panel through Add-ons include:

Customized Reporting and Analytics

Case: a shop wants to track and analyze different data points that are not included in the standard reporting functionality of the SCAYLE Panel.
Add-on: by extending the SCAYLE Panel with an Add-on that allows for customized reporting and analytics, the shop can generate more detailed reports on sales performance, customer behavior, and inventory management, and other metrics.

Enhanced Customer Service Features

Case: a shop wants to improve customer service capabilities by adding features like chatbots, automated responses, and personalization tools.
Add-on: an Add-on could integrate with a customer service platform (e.g., Zendesk), providing more efficient and effective customer support.

Case: a shop wants to leverage social media to increase brand awareness and drive traffic to their site.
Add-on: an Add-on could integrate with social media platforms, allowing the shop to automate processes such as posting updates, promoting products, and engaging with customers on social media.