Pulumi logo

Backstage Pulumi Plugin

View Pulumi stack information in Backstage.

Created by @pulumicorp

Pulumi is an open source infrastructure as code tool. It lets you implement your desired state infrastructure with regular programming languages.

The Backstage Pulumi plugin brings infrastructure data associated with your Pulumi stacks to your Developer Portal. The plugin can pull deployment information from a Pulumi Cloud. In this guide you'll find:

Skip the manual plugin installation with no-code Backstage

A screenshot of the Pulumi plugin.

Installation steps

Install the plugin.

cd packages/app
yarn add @pulumi/backstage-plugin-pulumi

Add the plugin API to your Backstage app.

// packages/app/src/components/catalog/EntityPage.tsx
import {
  isPulumiAvailable,
  EntityPulumiCard,
  EntityPulumiMetdataCard,
  PulumiComponent
} from '@pulumi/backstage-plugin-pulumi';

// add new Pulumi tab to the service component page when available
const pulumiContent = (
    <EntitySwitch>
        <EntitySwitch.Case if={isPulumiAvailable}>
            <PulumiComponent/>
        </EntitySwitch.Case>
    </EntitySwitch>
);

const overviewContent = (
  <EntityLayout>
    ...
    <EntitySwitch>
        <EntitySwitch.Case if={isPulumiAvailable}>
            <Grid item md={6}>
                <EntityPulumiCard variant="gridItem"/>
            </Grid>
        </EntitySwitch.Case>
    </EntitySwitch>
    ...
  </EntityLayout>
)

const serviceEntityPage = (
  <EntityLayout>
    ...
    <EntityLayout.Route path="/pulumi" title="Pulumi" if={isPulumiAvailable}>
        {pulumiContent}
    </EntityLayout.Route>
    ...
  </EntityLayout>
);

Add proxy configuration to your Backstage app's config. A Pulumi access token is required. See how to get a Pulumi access token below.

// app-config.yaml
proxy:
'/pulumi':
    target: 'https://api.pulumi.com/api'
    changeOrigin: true
    headers:
    Authorization: token ${PULUMI_ACCESS_TOKEN}
    Accept: application/vnd.pulumi+8
    Content-Type: application/json

Add Pulumi plugin annotation to your component's config. ()

// catalog-info.yaml
metadata:
  annotations:
      pulumi.com/project-slug: [ Pulumi Cloud Name: org/stackname/stack ]

Add Pulumi plugin annotation to your system entity. ()

// catalog-info.yaml
metadata:
  annotations:
      pulumi.com/orga-slug: <Pulumi Cloud: org>

Found a mistake? Update these instructions.

How to get a Pulumi Access Token

Your Backstage app’s backend connects to your Pulumi Cloud organization using the Pulumi Cloud Rest API. A Pulumi Access Token is required. This token can be obtained from a system environment variable (ex. PULUMI_ACCESS_TOKEN). This can be a personal access token, but is preferrably a team or organization access token.

See the respective documentation to create a Pulumi access token.

Prefer a no-code Backstage setup?

Become a Backstage expert

To get the latest news, deep dives into Backstage features, and a roundup of recent open-source action, sign up for Roadie's Backstage Weekly. See recent editions.

We will never sell or share your email address.