See Jira summary in Backstage
Install the plugin into Backstage.
yarn add @roadiehq/backstage-plugin-jira
Add proxy config
// app-config.yaml
proxy:
'/jira/api':
target: <JIRA_URL>
headers:
Authorization:
$env: JIRA_TOKEN
Accept: 'application/json'
Content-Type: 'application/json'
X-Atlassian-Token: 'nocheck'
User-Agent: "MY-UA-STRING"
Set img-src in Content Security Policy
// app-config.yaml
backend:
# ...
csp:
img-src:
# "'self'" and 'data' are from the backstage default but must be set since img-src is overriden
- "'self'"
- 'data:'
# Allow your Jira instance for @roadiehq/backstage-plugin-jira
- 'JIRA_URL'
Add plugin to the list of plugins
// packages/app/src/plugins.ts
export { plugin as Jira } from '@roadiehq/backstage-plugin-jira';
Add plugin API to your Backstage instance
// packages/app/src/components/catalog/EntityPage.tsx
import {
JiraCard,
isPluginApplicableToEntity as isJiraAvailable,
} from '@roadiehq/backstage-plugin-jira';
const OverviewContent = ({ entity }: { entity: Entity }) => (
<Grid container spacing={3} alignItems="stretch">
...
{isJiraAvailable(entity) && (
<Grid item md={6}>
<JiraCard entity={entity} />
</Grid>
)}
...
</Grid>
);
Add annotation to the yaml config file of a component
metadata:
annotations:
jira/project-key: <example-jira-project-key>
jira/component: <example-component> # optional, you might skip this value to fetch data for all components
Provide the JIRA_TOKEN environmental variable (instructions at the notes below)
JIRA_TOKEN
as env variable.Create a base64-encoded string by converting a string in format
”<your-atlassian-account-mail>:<your-jira-token>”
for example:
jira-mail@example.com:hTBgqVcrcxRYpT5TCzTA9C0F
converts to base64
amlyYS1tYWlsQGV4YW1wbGUuY29tOmhUQmdxVmNyY3hSWXBUNVRDelRBOUMwRg==
Save it as the environmental variable JIRA_TOKEN
with Basic
prefix, for example:
JIRA_TOKEN='Basic amlyYS1tYWlsQGV4YW1wbGUuY29tOmhUQmdxVmNyY3hSWXBUNVRDelRBOUMwRg=='
Alternatively, if you are running backstage locally, you can provide the variable by the command
env JIRA_TOKEN='Basic amlyYS1tYWlsQGV4YW1wbGUuY29tOmhUQmdxVmNyY3hSWXBUNVRDelRBOUMwRg==' yarn dev
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.