Backstage Workshop

Every team and every project evolves a tailored development environment. This collection of tools, services and configuration is often maintained by convention and transmitted by osmosis.

IDPs help teams curate, manage and replicate these environments. Backstage is an open source CNCF project for building developer platforms, and for encapsulating tools, services, documentation and best practices in “golden paths” to ease onboarding and daily development. Janus is Red Hat’s project for contributing to the Backstage core and the ecosystem around it. The IDP presented in this workshop is referred to by both names: fundamental Backstage features are described as such, while you’ll work with a running Janus instance labeled with that name.

In this end-to-end developer experience, you’ll start on a golden path we’ve paved to show how Red Hat products center on the OpenShift Container Platform to supply a foundation for cloud-native development.

Backstage will support you from the start with signposts to components in a single place connecting the three key developer views: an IDE to code, pipelines to build, and orchestration to deploy your application.

In these exercises you will use Backstage Templates to deploy the Points of Interest (POI) Map application. The POI Map shows location points on a world map that zooms and scrolls. Clicking on a location marker reveals its details.

POI Map defines a location to have a latitdue, longitude, name, and an optional description. It can display arbitrary locations. In this workshop, you’ll attach a data source containing hundreds of national parks around the world.

POI Map is divided into three application tiers:

In the first section, you’ll sign in to OpenShift and to Backstage with your GitHub ID. Notice that your GitHub ID is your user name in both OpenShift and Backstage, and that your application components are deployed to an OpenShift Project with the same name. Both your user name and your Project name will match the GitHub ID you use to authenticate.

In section 2, you’ll use two provided Templates to build and deploy the graphical map interface frontend and the API gateway that supports it.

While those two components establish the absolute minimum viable product of a global, dynamic map diplaying arbitrary locations, you’ll soon want a more interesting and robust data source for points on the map.

In section 3, you’ll use Backstage’s tools for exploring application Components and their connections to examine the deployed frontend and gateway to understand their places in the application architecture. The gateway provides a map location API used by the frontend. It also expects to consume a more database-centric backend API.

You’ll use another template to create and deploy that backend component. You’ll then have a map application displaying many location points around the world. Backstage lets Platform Engineers devise Golden Paths like this one that encapsulate the pieces of the applications a team might work on and guides developers in their quick deployment.

In section 4, you’ll extend your map app with a lower-level feature. Backstage links you from app components to the OpenShift Dev Spaces web IDE, where you can edit the gateway’s source code. Then you’ll see how Backstage helps you or your teammates discover, navigate and test your modified gateway API.