https://github.com/vippsas/backstage-azure-resource-frontend
A frontend plugin showing Azure resources in relation to entities in Backstage
https://github.com/vippsas/backstage-azure-resource-frontend
azure backstage
Last synced: 11 months ago
JSON representation
A frontend plugin showing Azure resources in relation to entities in Backstage
- Host: GitHub
- URL: https://github.com/vippsas/backstage-azure-resource-frontend
- Owner: vippsas
- License: mit
- Created: 2022-08-30T12:34:19.000Z (almost 4 years ago)
- Default Branch: main
- Last Pushed: 2023-02-16T18:29:18.000Z (over 3 years ago)
- Last Synced: 2025-06-03T23:49:42.339Z (about 1 year ago)
- Topics: azure, backstage
- Language: TypeScript
- Homepage:
- Size: 327 KB
- Stars: 14
- Watchers: 5
- Forks: 6
- Open Issues: 2
-
Metadata Files:
- Readme: docs/README.md
- License: LICENSE.md
Awesome Lists containing this project
README
# Azure resources front-end
This plugin shows information about Azure resources related to your backstage entity
## Getting started
[First install the backend plugin](https://github.com/ehrnst/backstage-azure-resources-backend). After that follow the below instructions.
```
# From your Backstage root directory
yarn add --cwd packages/app @vippsno/plugin-azure-resources
```
Add the following to `packages\app\src\components\catalog\EntityPage.tsx` The below enables all entity cards. Security, Cost advisor, and resource group.
```TypeScript
import { AzureResourceEntityOverviewCard, AZURE_ANNOTATION_TAG_SELECTOR, EntityAzureSecurityOverviewCard,EntityAzureCostAdviceOverviewCard, isAzureResourceEnabled } from '@vippsno/plugin-azure-resources';
```
```TypeScript
const azureResourceContent = (
<>
>
);
```
```TypeScript
{azureResourceContent}
```
### Annotation
This plugin use a custom annotation from your entity. To use the plugin add the following annotation:
```YAML
annotations:
azure.com/tag-selector: key/value
```
When doing Azure Resource Graph queries the plugin will use the tag key and its value to pull information.