Backstage Knative Event Mesh Plugin

Knative Event Mesh gives you an event backbone across your services. Producers publish to a broker. Triggers route events to subscribers with filters. Your apps do not need to know transport details. The mesh handles delivery and routing across clusters and clouds.

The Backstage plugin brings that picture into your portal. It pulls Knative Eventing data through a small backend that runs in your cluster. In Backstage you can see brokers, event types, and triggers with a cleaner view than raw YAML. You can follow relationships across these objects to understand who sends what to whom. This helps when you onboard a team, trace a broken flow, or review changes in an event contract. It fits teams that want one place to explore event driven systems without switching tools.

Install the cluster backend service

This plugin depends on a backend service that runs in your cluster. Install it with the published manifest.

Copy

# pick a release or use latest
export VERSION="latest"

kubectl apply -f "https://github.com/knative-extensions/backstage-plugins/releases/${VERSION}/download/eventmesh.yaml"

Set up environment for the Backstage side. You need a service account token for the backend service. Store it in variables for later use.

Copy

# example secret name shown here
export KUBE_SA_TOKEN="$(kubectl get secret my-eventmesh-backend-secret -o jsonpath='{.data.token}' | base64 --decode)"

# pass these to your Backstage process
export KNATIVE_EVENT_MESH_TOKEN="$KUBE_SA_TOKEN"

# if you run Backstage outside the cluster, you can use the cluster DNS name
export KNATIVE_EVENT_MESH_BACKEND="http://eventmesh-backend.knative-eventing.svc.cluster.local:8080"

# or port forward for local testing
# kubectl -n knative-eventing port-forward svc/eventmesh-backend 8080:8080
# export KNATIVE_EVENT_MESH_BACKEND="http://localhost:8080"

Note. The backend returns 401 when called without a token. That is expected.

Add the plugin to your Backstage instance

Standard Backstage app static plugin old backend system

Use the static distribution documented on Knative docs for installation steps. That guide shows which package to add to your backend and how to register its provider.

Add the same provider config block to your app config.

Copy

catalog:
  providers:
    knativeEventMesh:
      dev:
        token: '${KNATIVE_EVENT_MESH_TOKEN}'
        baseUrl: '${KNATIVE_EVENT_MESH_BACKEND}'
        schedule:
          frequency:
            minutes: 1
          timeout:
            minutes: 1

Build and run your backend with yarn.

Standard Backstage app static plugin new backend system

Use the static distribution documented on Knative docs for the new backend system. That guide shows which backend module to install and how to register it with the backend builder.

Add the same provider config block to your app config.

Copy

catalog:
  providers:
    knativeEventMesh:
      dev:
        token: '${KNATIVE_EVENT_MESH_TOKEN}'
        baseUrl: '${KNATIVE_EVENT_MESH_BACKEND}'
        schedule:
          frequency:
            minutes: 1
          timeout:
            minutes: 1

Build and run your backend with yarn.

Surface the entities in your frontend

The plugin syncs Knative Eventing resources into the Catalog. You can add quick links in the sidebar to help users find them.

Edit your app sidebar. File path usually looks like packages/app/src/components/Root/Root.tsx.

Copy

// packages/app/src/components/Root/Root.tsx
import React from 'react';
import { SidebarItem } from '@backstage/core-components';
import CategoryIcon from '@material-ui/icons/Category';

// inside your Sidebar component
<>
  <SidebarItem
    icon={CategoryIcon}
    to="/catalog?filters[kind]=EventType"
    text="Event Types"
  />
  <SidebarItem
    icon={CategoryIcon}
    to="/catalog?filters[kind]=Broker"
    text="Brokers"
  />
</>

You do not need to import any frontend component from this plugin. It runs as a backend provider and populates the Catalog. The standard Catalog pages render these entities.

Run the Backstage app with the plugin

Install dependencies then start your app with the environment variables set for the provider.

Copy

yarn install --frozen-lockfile

# ensure these two variables are in your shell environment
# KNATIVE_EVENT_MESH_TOKEN
# KNATIVE_EVENT_MESH_BACKEND

yarn dev

Configuration reference

Copy

catalog:
  providers:
    knativeEventMesh:
      dev:
        token: '${KNATIVE_EVENT_MESH_TOKEN}'
        baseUrl: '${KNATIVE_EVENT_MESH_BACKEND}'
        schedule:
          frequency:
            minutes: 1
          timeout:
            minutes: 1

Backstage Knative Event Mesh Plugin

Installation Instructions

Install the cluster backend service

Add the plugin to your Backstage instance

Standard Backstage app static plugin old backend system

Standard Backstage app static plugin new backend system

Surface the entities in your frontend

Run the Backstage app with the plugin

Configuration reference

Changelog

Breaking changes

Features

Documentation

Set up Backstage in minutes with Roadie