Skip to content

Scalr/scalr-backstage-plugin

Repository files navigation

Scalr Backstage Plugin (Frontend & Backend)

This repository provides both the frontend and backend plugins required to integrate Scalr with Backstage.


🔧 Setup

Backend Plugin

Installation

Install the backend plugin from the GitHub release:

yarn workspace backend add @scalr-io/backstage-plugin-scalr-backend

Integration

Add the plugin to your Backstage backend:

// packages/backend/src/index.ts

import { createBackend } from '@backstage/backend-defaults';
const backend = createBackend();
...
+ backend.add(import('@scalr-io/backstage-plugin-scalr-backend'));

backend.start();

Frontend Plugin

Installation

Install the frontend plugin from the GitHub release:

yarn workspace app add @scalr-io/backstage-plugin-scalr

Integration

Add the plugin route to your entity page:

// packages/app/src/components/catalog/EntityPage.ts

+ import { EntityScalrEnvironmentContent } from '@scalr-io/backstage-plugin-scalr';

const domainPage = (
  <EntityLayout>
    <EntityLayout.Route path="/" title="Overview">
      <Grid container spacing={3} alignItems="stretch">
        {entityWarningContent}
        <Grid item md={6}>
          <EntityAboutCard variant="gridItem" />
        </Grid>
        <Grid item md={6} xs={12}>
          <EntityCatalogGraphCard variant="gridItem" height={400} />
        </Grid>
        <Grid item md={6}>
          <EntityHasSystemsCard variant="gridItem" />
        </Grid>
      </Grid>
    </EntityLayout.Route>

+   <EntityLayout.Route path="/scalr" title="Scalr">
+     <EntityScalrEnvironmentContent />
+   </EntityLayout.Route>
  </EntityLayout>
);

ℹ️ You can integrate the plugin into any entity page based on your organizational structure. You can also extend the catalog with custom entity kinds and attach the plugin accordingly.


Configuration

The backend requires authentication credentials to access the Scalr API. Add the following to your app-config.local.yaml (or equivalent):

# app-config.local.yaml

integrations:
  scalr:
    api-token: <YOUR_API_TOKEN>
    base-url: <YOUR_BASE_URL>
  • API Token: Obtain it via the Scalr UI under your user profile → Personal Access Tokens.
  • Base URL: This is the hostname of your Scalr instance (e.g. organization.scalr.io), which you’ll see in your browser's address bar when logged in.

🚀 Usage

To enable the plugin on a specific entity, add the following annotation to its metadata:

apiVersion: backstage.io/v1alpha1
kind: Domain
metadata:
  name: example
  annotations:
    scalr.com/environment: <ENVIRONMENT_ID>
spec:
  owner: guests

🔖 Replace <ENVIRONMENT_ID> with the ID of the Scalr environment you want to associate.

About

Scalr plugin for Backstage

Resources

License

Stars

Watchers

Forks

Packages

No packages published

Contributors 2

  •  
  •