Design Studio allows you – via extensions – to add any arbitrary Javascript/HTML/CSS web content to your apps and dashboards. These extensions are not one-offs. Rather, they become part of your palette and are always available when you are working on apps in the designer. This tutorial series walks you through the entire process of creating a your first functional component; a configurable gauge component. It presumes that you have Eclipse and Design Studio installed and that you know your way around Design Studio. Prior knowledge of html, Javascript and CSS is helpful, but not mandatory. We’ll walk you through the bits that you need to know.
There are many Design Studio SDK articles on this site and this tutorial series does not break new ground in that respect. What it does do, is try to bring a comprehensive, systematic approach to learning how to use the SDK.
Notes on Terminology
Dashboard and Application seem to be used interchangeably. If there is any consensus, it might be that “dashboards” are simpler and “applications” are more complex. There is no consensus on when a dashboard has enough complexity to be called an application. For simplicity, since we don’t want to always write “dashboards and applications”, we’ll just call them apps here.
Likewise, “Extension” and “Plugin” are interchangeable. Here, however, we will split hairs and make an arbitrary distinction. An “Extension” means the web content that you’ll want to make available to Design Studio and that icon in the design palette, which the designer will access. “Plugin” refers to the technical plumbing that you’ll need to supply to Design Studio’s Eclipse core; in order to make your extension available to the designer. The designer of an app installs and uses an extension. The developer of an extension makes a plugin.
Chapters: