Get Roadie in your IDE with our new MCP Servers
Roadie
← Backstage Plugins Guides
Firefly logo

Backstage Firefly Plugin

Created by Firefly

Firefly is a cloud infrastructure automation platform. The Firefly Backstage plugin brings that context into your developer portal so teams can see what runs in the cloud next to the services they own.The plugin ships with a backend and a frontend. It imports cloud assets as resource entities and cloud accounts as system entities. It relates those assets to components by tags or by matching names. It keeps the catalog fresh on a schedule. In Backstage it surfaces key metrics, IaC coverage, and highlights unmanaged or drifted resources both on a dedicated page and on entity pages.

Common use cases include centralizing visibility across AWS, Azure, and GCP, finding shadow infrastructure, tracking IaC coverage by service, and cutting context switching during triage. Platform teams get live relationships between systems, services, and resources so ownership is clear during incidents and reviews.

Teams are already using this in the wild. ZoomInfo reports better incident response with the plugin. In their words, “Firefly’s Backstage plugin has significantly streamlined our cloud resource management by creating a centralized catalog.”

Installation Instructions

These instructions apply to self-hosted Backstage only.

Install the frontend plugin

  1. Add the package to your app workspace
Copy 
cd packages/app
yarn add @fireflyai/backstage-plugin-firefly
  1. Register the Firefly page route
Copy 
// packages/app/src/App.tsx
import React from 'react';
import { Route } from 'react-router';
import { FireflyPage } from '@fireflyai/backstage-plugin-firefly';

// find your <FlatRoutes> or similar and add this route
<Route path="/firefly" element={<FireflyPage />} />
  1. Add a sidebar item so users can reach the page
Copy 
// packages/app/src/components/Root/Root.tsx
import React from 'react';
import ExtensionIcon from '@material-ui/icons/Extension';
import { SidebarItem } from '@backstage/core-components';

// add this inside your <Sidebar>
<SidebarItem icon={ExtensionIcon} to="firefly" text="Firefly" />
  1. Add the IaC coverage card to entity pages
Copy 
// packages/app/src/components/catalog/EntityPage.tsx
import React from 'react';
import Grid from '@material-ui/core/Grid';
import { EntityDependenciesIaCCoverageCard } from '@fireflyai/backstage-plugin-firefly';

// place this inside the entity page layout
<Grid item md={4} xs={12}>
  <EntityDependenciesIaCCoverageCard />
</Grid>

Install the backend plugin new backend system

  1. Add the package to your backend workspace
Copy 
cd packages/backend
yarn add @fireflyai/backstage-backend-plugin-firefly
  1. Provide Firefly credentials to the backend process
Copy 
export FIREFLY_ACCESS_KEY=<your-access-key>
export FIREFLY_SECRET_KEY=<your-secret-key>
  1. Add plugin config to your app config
Copy 
# app-config.yaml
firefly:
  periodicCheck:
    interval: 3600            # seconds default 3600
    importSystems: true       # import cloud accounts as systems
    correlateByComponentName: true
    importResources: true
    tagKeysIdentifiers:
      - environment
      - component
    filters:
      assetTypes:
        - aws_s3_bucket
        - aws_lambda_function
      providerIds:
        - '123456789012'
      includeConfiguration: true
  1. Register the backend module
Copy 
// packages/backend/src/index.ts
// the backend is created earlier in this file
// add this line with the other plugin registrations
backend.add(import('@fireflyai/backstage-backend-plugin-firefly'));

Install the backend plugin legacy backend system

This backend package exposes a new backend module. It does not publish a legacy router. If you still run the legacy backend, migrate to the new backend system first. After migration, use the steps in the section above to register the module.

Notes on configuration

  • tagKeysIdentifiers lets the plugin relate catalog components to cloud resources by tag keys
  • correlateByComponentName relates resources to components when a resource tag value matches a component name
  • filters lets you scope which assets to import by assetTypes and providerIds
  • includeConfiguration adds resource configuration into the resource entity description

Where you will see things

  • The Firefly page is available at path /firefly
  • The sidebar entry shows as Firefly in the left navigation
  • The IaC coverage card appears on each entity page where you added the card

What the backend does

  • Imports Firefly assets as catalog resource entities
  • Imports cloud accounts as system entities
  • Builds relationships between resources systems and your existing components
  • Runs periodic refresh based on the interval you set

Changelog

This changelog is produced from commits made to the Firefly plugin since 7 months ago, and based on the code located here. It may not contain information about all commits. Releases and version bumps are intentionally omitted. This changelog is generated by AI.

Documentation

  • Update README #2 merged 4 months ago

Breaking changes

  • None

Set up Backstage in minutes with Roadie

Get a demo