Backstage iLert Plugin

iLert is an incident response platform that covers alerting, on call scheduling, and uptime monitoring. It connects to your monitors, routes alerts to the right people, escalates when needed, and helps keep stakeholders informed. The goal is simple. Cut time to acknowledge and resolve.

The iLert plugin brings that workflow into Backstage. You can see who is on call for a service. You can view active incidents and key details without leaving the catalog. You can trigger a new incident from a service page. You can acknowledge, reassign, or resolve an alert when context is fresh. You can run incident actions, start immediate maintenance on an alert source, or enable and disable a source. The plugin also surfaces uptime monitors, services, and status pages so teams can check health next to ownership and docs.

Common use cases are clear. Add on call context to every service. Handle alerts during a deploy review. Kick off an incident from the service that failed. Give SREs and owners one place to check status and act. Less tab switching in the moments that matter.

Install the frontend package

Copy

yarn --cwd packages/app add @backstage-community/plugin-ilert

Add the iLert entity card

Edit packages app src components catalog EntityPage tsx

Import the components from the plugin

Copy

import {
  isPluginApplicableToEntity as isILertAvailable,
  EntityILertCard,
} from '@backstage-community/plugin-ilert';

Render the card on entity pages

Copy

// inside your entity page content
<EntitySwitch>
  <EntitySwitch.Case if={isILertAvailable}>
    <Grid item sm={6}>
      <EntityILertCard />
    </Grid>
  </EntitySwitch.Case>
</EntitySwitch>

If you want to always show the card place the component directly

Copy

<Grid item sm={6}>
  <EntityILertCard />
</Grid>

Add the page route in packages app src App tsx

Copy

import { ILertPage } from '@backstage-community/plugin-ilert';

<FlatRoutes>
  {/* other routes */}
  <Route path="/ilert" element={<ILertPage />} />
</FlatRoutes>

Add the sidebar item in packages app src components Root Root tsx

Copy

import { ILertIcon } from '@backstage-community/plugin-ilert';

<Sidebar>
  {/* other items */}
  <SidebarItem icon={ILertIcon} to="ilert" text="iLert" />
</Sidebar>

Configure the proxy for iLert API calls

Add this to app config yaml

Copy

proxy:
  '/ilert':
    target: https://api.ilert.com
    allowedMethods: ['GET', 'POST', 'PUT']
    allowedHeaders: ['Authorization']
    headers:
      Authorization: ${ILERT_AUTH_HEADER}

Optional base URL override

Copy

ilert:
  baseUrl: https://my-org.ilert.com/

Wire the proxy plugin on the new backend system

Install the proxy backend into your backend package

Copy

yarn --cwd packages/backend add @backstage/plugin-proxy-backend

Copy

import { createBackend } from '@backstage/backend-defaults';
import { proxyPlugin } from '@backstage/plugin-proxy-backend';

const backend = createBackend();

backend.add(proxyPlugin());

backend.start();

Wire the proxy plugin on the old backend system

Install the proxy backend into your backend package

Copy

yarn --cwd packages/backend add @backstage/plugin-proxy-backend

Create packages backend src plugins proxy ts

Copy

import { createRouter } from '@backstage/plugin-proxy-backend';
import { Logger } from 'winston';
import { PluginEnvironment } from '../types';

export default async function createPlugin(
  env: PluginEnvironment,
) {
  return await createRouter({
    config: env.config,
    logger: env.logger as Logger,
    discovery: env.discovery,
  });
}

Copy

import proxy from './plugins/proxy';

// inside the main bootstrap
const proxyEnv = useHotMemoize(module, () => createEnv('proxy'));
apiRouter.use('/proxy', await proxy(proxyEnv));

Supply the iLert auth header at runtime

Start the backend with the auth header

Copy

ILERT_AUTH_HEADER='<YOUR_AUTH_HEADER>' yarn --cwd packages/backend start

You can pass a bearer token or basic auth in that variable

Add the iLert integration key to your entities

Add this annotation to each entity that should show iLert data

Copy

apiVersion: backstage.io/v1alpha1
kind: Component
metadata:
  name: example
  annotations:
    ilert.com/integration-key: YOUR_INTEGRATION_KEY
spec:
  type: service
  owner: team-a
  lifecycle: production

Backstage iLert Plugin

Installation Instructions

Install the frontend package

Add the iLert entity card

Add the iLert explorer page and sidebar link

Configure the proxy for iLert API calls

Wire the proxy plugin on the new backend system

Wire the proxy plugin on the old backend system

Supply the iLert auth header at runtime

Add the iLert integration key to your entities

Changelog

Maintenance

Set up Backstage in minutes with Roadie