We're hiring! Become a Backstage contributor

Backstage Travis CI Plugin

See builds in Backstage

Getting started is simple

In the backstage/packages/app project add the plugin as a package.json dependency:

yarn add @roadiehq/backstage-plugin-travis-ci

Add proxy configurations

// app-config.yaml
proxy:
  # ...

  '/travisci/api':
    target: https://api.travis-ci.com
    changeOrigin: true
    headers:
      Authorization: ${TRAVISCI_AUTH_TOKEN}
      travis-api-version: 3

Add a separate configuration object.

// app-config.yaml
travisci:
  baseUrl: 'https://travis-ci.com/'

Import it into your Backstage application

// packages/app/src/components/catalog/EntityPage.tsx
import {
  EntityTravisCIContent,
  EntityTravisCIOverviewCard,
  isTravisciAvailable,
} from '@roadiehq/backstage-plugin-travis-ci';

Add plugin API to your Backstage instance

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

export const cicdContent = (
  <EntitySwitch>
    <EntitySwitch.Case if={isTravisciAvailable}>
      <EntityTravisCIContent />
    </EntitySwitch.Case>
    ...
  </EntitySwitch>
);

Add recent Travis-CI builds widget/card to your Overview card.

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

export const cicdCard = (
  <EntitySwitch>
    <EntitySwitch.Case if={isTravisciAvailable}>
      <EntityTravisCIOverviewCard />
    </EntitySwitch.Case>
    ...
  </EntitySwitch>
);

Add annotation to the yaml config file of a component

travis-ci.com/repo-slug: owner-name/project-name

Add your developer api key to the environment variables of your backstage backend server (you can find it in https://travis-ci.com/account/preferences), in the form of the word 'token' followed by your api key. So it should look like this

TRAVISCI_AUTH_TOKEN="token your-api-key"

Found a mistake? Update these instructions.

How it looks

A screenshot of the Travis CI plugin. It is showing a list of builds for a sample service.

Things to know

Features

List Travis CI Builds
Retrigger builds

To use the Travis CI Backstage plugin, first visit Travis CI to get an API token: Travis Preferences

There are two versions of Travis CI: https://travis-ci.com and https://travis-ci.org. travis-ci.org is deprecated and not supported in this plugin.

Copy the token to your clipboard.

Each build can be retried via the column on the right hand side.

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.