Merge branch 'master' into feat/githubMultiOrgReaderProcessor
@@ -0,0 +1,38 @@
|
||||
/*
|
||||
* Copyright 2021 The Backstage Authors
|
||||
*
|
||||
* Licensed under the Apache License, Version 2.0 (the "License");
|
||||
* you may not use this file except in compliance with the License.
|
||||
* You may obtain a copy of the License at
|
||||
*
|
||||
* http://www.apache.org/licenses/LICENSE-2.0
|
||||
*
|
||||
* Unless required by applicable law or agreed to in writing, software
|
||||
* distributed under the License is distributed on an "AS IS" BASIS,
|
||||
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
||||
* See the License for the specific language governing permissions and
|
||||
* limitations under the License.
|
||||
*/
|
||||
|
||||
const {
|
||||
default: defaultChangelogFunctions,
|
||||
} = require('@changesets/cli/changelog');
|
||||
|
||||
// Custom CHANGELOG generation for changesets, stolen from here with one minor change:
|
||||
// https://github.com/atlassian/changesets/blob/main/packages/cli/src/changelog/index.ts
|
||||
async function getDependencyReleaseLine(changesets, dependenciesUpdated) {
|
||||
if (dependenciesUpdated.length === 0) return '';
|
||||
|
||||
const updatedDepenenciesList = dependenciesUpdated.map(
|
||||
dependency => ` - ${dependency.name}@${dependency.newVersion}`,
|
||||
);
|
||||
|
||||
// Return one `Updated dependencies` bullet instead of repeating for each changeset; this
|
||||
// sacrifices the commit shas for brevity.
|
||||
return ['- Updated dependencies', ...updatedDepenenciesList].join('\n');
|
||||
}
|
||||
|
||||
module.exports = {
|
||||
getReleaseLine: defaultChangelogFunctions.getReleaseLine,
|
||||
getDependencyReleaseLine,
|
||||
};
|
||||
@@ -1,10 +1,13 @@
|
||||
{
|
||||
"$schema": "https://unpkg.com/@changesets/config@1.3.0/schema.json",
|
||||
"changelog": "@changesets/cli/changelog",
|
||||
"changelog": "./backstage-changelog.js",
|
||||
"commit": false,
|
||||
"linked": [["*"]],
|
||||
"access": "public",
|
||||
"baseBranch": "master",
|
||||
"updateInternalDependencies": "patch",
|
||||
"ignore": []
|
||||
"ignore": [],
|
||||
"___experimentalUnsafeOptions_WILL_CHANGE_IN_PATCH": {
|
||||
"onlyUpdatePeerDependentsWhenOutOfRange": true
|
||||
}
|
||||
}
|
||||
|
||||
@@ -0,0 +1,5 @@
|
||||
---
|
||||
'@backstage/plugin-scaffolder-backend': patch
|
||||
---
|
||||
|
||||
Fix `catalog:write` on windows systems
|
||||
@@ -0,0 +1,5 @@
|
||||
---
|
||||
'@backstage/core-app-api': patch
|
||||
---
|
||||
|
||||
Reintroduce export of `defaultConfigLoader`.
|
||||
@@ -0,0 +1,5 @@
|
||||
---
|
||||
'@backstage/plugin-auth-backend': patch
|
||||
---
|
||||
|
||||
Unbreak `.well-known` OIDC routes
|
||||
@@ -0,0 +1,5 @@
|
||||
---
|
||||
'@backstage/plugin-cost-insights': patch
|
||||
---
|
||||
|
||||
Replaced moment and dayjs with Luxon
|
||||
@@ -0,0 +1,7 @@
|
||||
---
|
||||
'@backstage/techdocs-common': patch
|
||||
'@backstage/plugin-register-component': patch
|
||||
'@backstage/plugin-techdocs-backend': patch
|
||||
---
|
||||
|
||||
Update "service catalog" references to "software catalog"
|
||||
@@ -0,0 +1,32 @@
|
||||
---
|
||||
'@backstage/core-components': patch
|
||||
---
|
||||
|
||||
Make `ErrorBoundary` display more helpful information about the error that
|
||||
occurred.
|
||||
|
||||
The `slackChannel` (optional) prop can now be passed as an object on the form
|
||||
`{ name: string; href?: string; }` in addition to the old string form. If you
|
||||
are using the error boundary like
|
||||
|
||||
```tsx
|
||||
<ErrorBoundary slackChannel="#support">
|
||||
<InnerComponent>
|
||||
</ErrorBoundary>
|
||||
```
|
||||
|
||||
you may like to migrate it to
|
||||
|
||||
```tsx
|
||||
const support = {
|
||||
name: '#support',
|
||||
href: 'https://slack.com/channels/your-channel',
|
||||
};
|
||||
|
||||
<ErrorBoundary slackChannel={support}>
|
||||
<InnerComponent>
|
||||
</ErrorBoundary>
|
||||
```
|
||||
|
||||
Also deprecated the prop `slackChannel` on `TabbedCard` and `InfoCard`, while
|
||||
adding the prop `errorBoundaryProps` to replace it.
|
||||
@@ -0,0 +1,5 @@
|
||||
---
|
||||
'@backstage/plugin-catalog-backend': patch
|
||||
---
|
||||
|
||||
Ensure that emitted relations are deduplicated
|
||||
@@ -0,0 +1,5 @@
|
||||
---
|
||||
'@backstage/plugin-auth-backend': patch
|
||||
---
|
||||
|
||||
Show better error message when configs defined under auth.providers.<provider> are undefined.
|
||||
@@ -0,0 +1,24 @@
|
||||
---
|
||||
'@backstage/plugin-catalog-backend': minor
|
||||
---
|
||||
|
||||
Move `LdapOrgReaderProcessor` from `@backstage/plugin-catalog-backend`
|
||||
to `@backstage/plugin-catalog-backend-module-ldap`.
|
||||
|
||||
The `LdapOrgReaderProcessor` isn't registered by default anymore, if
|
||||
you want to continue using it you have to register it manually at the catalog
|
||||
builder:
|
||||
|
||||
1. Add dependency to `@backstage/plugin-catalog-backend-module-ldap` to the `package.json` of your backend.
|
||||
2. Add the processor to the catalog builder:
|
||||
|
||||
```typescript
|
||||
// packages/backend/src/plugins/catalog.ts
|
||||
builder.addProcessor(
|
||||
LdapOrgReaderProcessor.fromConfig(config, {
|
||||
logger,
|
||||
}),
|
||||
);
|
||||
```
|
||||
|
||||
For more configuration details, see the [README of the `@backstage/plugin-catalog-backend-module-ldap` package](https://github.com/backstage/backstage/blob/master/plugins/catalog-backend-module-ldap/README.md).
|
||||
@@ -0,0 +1,5 @@
|
||||
---
|
||||
'@backstage/plugin-catalog': patch
|
||||
---
|
||||
|
||||
Get rid of flex console warning for IconLink
|
||||
@@ -1,5 +1,5 @@
|
||||
/*
|
||||
* Copyright 2021 Spotify AB
|
||||
* Copyright 2021 The Backstage Authors
|
||||
*
|
||||
* Licensed under the Apache License, Version 2.0 (the "License");
|
||||
* you may not use this file except in compliance with the License.
|
||||
@@ -25,6 +25,12 @@ module.exports = {
|
||||
{
|
||||
// eslint-disable-next-line no-restricted-syntax
|
||||
templateFile: path.resolve(__dirname, './scripts/copyright-header.txt'),
|
||||
templateVars: {
|
||||
NAME: 'The Backstage Authors',
|
||||
},
|
||||
varRegexps: {
|
||||
NAME: /(The Backstage Authors)|(Spotify AB)/,
|
||||
},
|
||||
onNonMatchingHeader: 'replace',
|
||||
},
|
||||
],
|
||||
|
||||
@@ -4,7 +4,7 @@
|
||||
# The last matching pattern takes precedence.
|
||||
# https://help.github.com/articles/about-codeowners/
|
||||
|
||||
* @backstage/maintainers
|
||||
* @backstage/reviewers
|
||||
/docs/features/techdocs @backstage/techdocs-core
|
||||
/docs/features/search @backstage/techdocs-core
|
||||
/docs/assets/search @backstage/techdocs-core
|
||||
|
||||
@@ -14,11 +14,15 @@ coverage:
|
||||
# Since Backstage is a mono repo, flags here help in getting the code coverage of individual packages.
|
||||
# Documentation: https://docs.codecov.io/docs/flags
|
||||
flags:
|
||||
core:
|
||||
core-app-api:
|
||||
paths:
|
||||
- packages/core/
|
||||
- packages/core-app-api/
|
||||
carryforward: true
|
||||
core-api:
|
||||
core-components:
|
||||
paths:
|
||||
- packages/core-api/
|
||||
- packages/core-components/
|
||||
carryforward: true
|
||||
core-plugin-api:
|
||||
paths:
|
||||
- packages/core-plugin-api/
|
||||
carryforward: true
|
||||
|
||||
@@ -52,10 +52,12 @@ cookiecutter
|
||||
css
|
||||
Datadog
|
||||
dataflow
|
||||
dayjs
|
||||
deadnaming
|
||||
debounce
|
||||
Debounce
|
||||
declaratively
|
||||
deduplicated
|
||||
deps
|
||||
destructured
|
||||
dev
|
||||
@@ -120,6 +122,7 @@ Knex
|
||||
kubectl
|
||||
kubernetes
|
||||
kubernetes
|
||||
ldap
|
||||
learnings
|
||||
Leasot
|
||||
lerna
|
||||
@@ -149,6 +152,7 @@ Mkdocs
|
||||
monorepo
|
||||
Monorepo
|
||||
monorepos
|
||||
msgraph
|
||||
msw
|
||||
mysql
|
||||
namespace
|
||||
@@ -172,6 +176,7 @@ oidc
|
||||
Okta
|
||||
onboarding
|
||||
Onboarding
|
||||
orgs
|
||||
pagerduty
|
||||
pageview
|
||||
parallelization
|
||||
@@ -203,6 +208,8 @@ repo
|
||||
Repo
|
||||
repos
|
||||
rerender
|
||||
Reusability
|
||||
reusability
|
||||
rollbar
|
||||
Rollbar
|
||||
Rollup
|
||||
@@ -220,6 +227,7 @@ seb
|
||||
semlas
|
||||
semver
|
||||
Serverless
|
||||
siloed
|
||||
Sinon
|
||||
Snyk
|
||||
sourcemaps
|
||||
@@ -266,6 +274,7 @@ transpilation
|
||||
transpiled
|
||||
truthy
|
||||
ui
|
||||
unbreak
|
||||
unmanaged
|
||||
unregister
|
||||
unregistration
|
||||
|
||||
@@ -4,8 +4,7 @@ on:
|
||||
paths:
|
||||
- '.github/workflows/chromatic-storybook-test.yml'
|
||||
- 'packages/storybook/**'
|
||||
- 'packages/core/src/components/**'
|
||||
- 'packages/core/src/layout/**'
|
||||
- 'packages/core-components/src/**'
|
||||
|
||||
jobs:
|
||||
chromatic:
|
||||
|
||||
@@ -53,6 +53,10 @@ jobs:
|
||||
- name: verify type dependencies
|
||||
run: yarn lint:type-deps
|
||||
|
||||
# The core packages need to be built for the codemods tests to work
|
||||
- name: build core packages
|
||||
run: lerna run --scope @backstage/core-* build
|
||||
|
||||
- name: test
|
||||
run: yarn lerna -- run test
|
||||
env:
|
||||
|
||||
@@ -119,8 +119,9 @@ jobs:
|
||||
yarn lerna -- run test -- --coverage
|
||||
bash <(curl -s https://codecov.io/bash)
|
||||
# Upload code coverage for some specific flags. Also see .codecov.yml
|
||||
bash <(curl -s https://codecov.io/bash) -f packages/core/coverage/* -F core
|
||||
bash <(curl -s https://codecov.io/bash) -f packages/core-api/coverage/* -F core-api
|
||||
bash <(curl -s https://codecov.io/bash) -f packages/core-app-api/coverage/* -F core-app-api
|
||||
bash <(curl -s https://codecov.io/bash) -f packages/core-components/coverage/* -F core-components
|
||||
bash <(curl -s https://codecov.io/bash) -f packages/core-plugin-api/coverage/* -F core-plugin-api
|
||||
env:
|
||||
BACKSTAGE_TEST_DATABASE_POSTGRES13_CONNECTION_STRING: postgresql://postgres:postgres@localhost:${{ job.services.postgres13.ports[5432] }}
|
||||
BACKSTAGE_TEST_DATABASE_POSTGRES9_CONNECTION_STRING: postgresql://postgres:postgres@localhost:${{ job.services.postgres9.ports[5432] }}
|
||||
|
||||
@@ -7,7 +7,7 @@ on:
|
||||
paths:
|
||||
- '.github/workflows/microsite-with-storybook-deploy.yml'
|
||||
- 'packages/storybook/**'
|
||||
- 'packages/core/src/**'
|
||||
- 'packages/core-components/src/**'
|
||||
- 'microsite/**'
|
||||
- 'docs/**'
|
||||
|
||||
|
||||
@@ -1,32 +1,36 @@
|
||||
| Organization | Contact | Description of Use |
|
||||
| ------------------------------------------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ |
|
||||
| [Spotify](https://www.spotify.com) | [@leemills83](https://github.com/leemills83) | Main interface towards all of Spotify's infrastructure and technical documentation. |
|
||||
| [bol.com](https://www.bol.com) | [@RoyJacobs](https://github.com/RoyJacobs) | Initial work being done to unify platform tooling. |
|
||||
| [DFDS](https://www.dfds.com) | [@carlsendk](https://github.com/carlsendk) | V2 self-service platform. |
|
||||
| [Roadie](https://roadie.io) | [@dtuite](https://github.com/dtuite) | Hosted, managed Backstage with easy set-up |
|
||||
| [Roku](https://www.roku.com) | [@timurista](https://github.com/timurista) | Initial work on Cloud engineering service platform. |
|
||||
| [SDA SE](https://sda.se) | [@Fox32](https://github.com/Fox32) | Central place for developing and sharing services in our insurance ecosystem. |
|
||||
| [H-E-B](https://www.heb.com) | [@german-j-rodriguez](https://github.com/german-j-rodriguez) | Initial work on Engineering Portal service platform. |
|
||||
| [American Airlines](https://www.aa.com) | [@paulpach](https://github.com/paulpach) | Central place for developers to develop and maintain applications |
|
||||
| [Kiwi.com](https://kiwi.com) | [@aexvir](https://github.com/aexvir) | Replacing the frontend of [The Zoo](https://github.com/kiwicom/the-zoo), their service registry. |
|
||||
| [Voi](https://www.voiscooters.com/) | [@K-Phoen](https://github.com/K-Phoen) | Developer portal, main gateway to our infrastructure, documentation and internal tooling. |
|
||||
| [Talkdesk](https://www.talkdesk.com) | [@jaime-talkdesk](https://github.com/jaime-talkdesk) | Initial work for Engineering Portal and Self Provisioning to R&D |
|
||||
| [Wealthsimple](https://www.wealthsimple.com) | [@andrewthauer](https://github.com/andrewthauer) | Developer portal, service catalog, documentation and tooling |
|
||||
| [Grab](https://www.grab.com) | [@althafh](https://github.com/althafh) | Initial work as a unified interface for all of Grab's internal tooling |
|
||||
| [Telenor Sweden](https://www.telenor.se) | [@O5ten](https://github.com/O5ten) | Building a developer portal for scaffolding projects towards our unified build environment and microservice stacks |
|
||||
| [Fiverr](https://www.fiverr.com) | [@nirga](https://github.com/nirga) | Unifying separate tools that developers are using today (i.e. monitoring, dead letter queues management, etc.) into a single platform. |
|
||||
| [Zalando SE](https://www.zalando.de) | [@leviferreira](https://github.com/leviferreira) | Building V2 of the Internal Development Portal. |
|
||||
| [LegalZoom](https://legalzoom.com) | [@backjo](https://github.com/backjo) | Developer portal - hub for all engineering projects and metadata. |
|
||||
| [Expedia Group](https://www.expediagroup.com) | [Mike Turner](mailto:miturner@expediagroup.com), [Sneha Kumar](mailto:snkumar@expediagroup.com), [@guillermomanzo](https://github.com/guillermomanzo), [Erik Lindgren](https://github.com/lindgren) | EG Common Developer Toolkit |
|
||||
| [Paddle.com](https://paddle.com) | [Ioannis Georgoulas](https://github.com/geototti21) | Developer portal (Tech Docs, Service Catalog, Internal Tooling), we use vanilla Backstage FE and custom BE implementation in Go |
|
||||
| [Acast.com](https://acast.com) | [Olle Lundberg](https://github.com/lndbrg) | Developer portal with tech docs, service catalog and a bunch of other internal tooling |
|
||||
| [Lunar](https://lunar.app) | [Jacob Valdemar](https://github.com/JacobValdemar) | Internal developer portal for service overview and insights, API documentation, technical guides, onboarding guides and RFC's. |
|
||||
| [Trendyol](https://trendyol.com) | [Erdogan Oksuz](https://github.com/erdoganoksuz) | The Developer Portal has been called `Pandora`. Provides an overview of Trendyol tech ecosystem. TechDocs, Catalog, Custom Plugins and Theme. |
|
||||
| [Peloton](https://www.onepeloton.com/) | [Jim Haughwout](https://github.com/JimHaughwout) | Creating our first developer portal and tech-docs. Exploring Service Catalog, Tech Insights and Cost Insights as well. |
|
||||
| [TELUS](https://telus.com) | [Seb Barre](https://github.com/sbarre) | The Go-to place to find answers about development and delivery at TELUS. |
|
||||
| [Brex](https://www.brex.com/) | [Vamsi Chitters](https://github.com/vamsikc) | A centralized UI to understand how a service fits in the whole Brex architecture and manage a team’s engineering dependencies. |
|
||||
| [Oriflame](https://www.oriflame.com/) | [Oriflame](https://github.com/oriflame) | Internal developer portal for services, single page apps and packages overview, API documentation, technical guides, tech-radar and more. |
|
||||
| [Booz Allen Hamilton](https://www.boozallen.com/) | [Jason Miller](https://github.com/JasonMiller-BAH) | Developer portal for a full-stack software development ecosystem that accelerates consistent and repeatable Modern Software Development practices for internal innovation and investments. |
|
||||
| [Netflix](https://www.netflix.com/) | [bleathem](https://github.com/bleathem) | Our Backstage implementation will be the front door to a unified experience connecting our internal platform products across important workflows with integrated knowledge and support. |
|
||||
| [b.well](https://www.icanbwell.com/) | [Jacob Rosales](https://github.com/jrosales) | Foundation for our engineering portal and cloud insights. |
|
||||
| [PagerDuty](https://www.pagerduty.com/) | [Mark Shaw](https://github.com/markshawtoronto) | Developer portal, initially focused on software templates and tech-docs. |
|
||||
| Organization | Contact | Description of Use |
|
||||
| ------------------------------------------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
|
||||
| [Spotify](https://www.spotify.com) | [@leemills83](https://github.com/leemills83) | Main interface towards all of Spotify's infrastructure and technical documentation. |
|
||||
| [bol.com](https://www.bol.com) | [@RoyJacobs](https://github.com/RoyJacobs) | Initial work being done to unify platform tooling. |
|
||||
| [DFDS](https://www.dfds.com) | [@carlsendk](https://github.com/carlsendk) | V2 self-service platform. |
|
||||
| [Roadie](https://roadie.io) | [@dtuite](https://github.com/dtuite) | Hosted, managed Backstage with easy set-up |
|
||||
| [Roku](https://www.roku.com) | [@timurista](https://github.com/timurista) | Initial work on Cloud engineering service platform. |
|
||||
| [SDA SE](https://sda.se) | [@Fox32](https://github.com/Fox32) | Central place for developing and sharing services in our insurance ecosystem. |
|
||||
| [H-E-B](https://www.heb.com) | [@german-j-rodriguez](https://github.com/german-j-rodriguez) | Initial work on Engineering Portal service platform. |
|
||||
| [American Airlines](https://www.aa.com) | [@paulpach](https://github.com/paulpach) | Central place for developers to develop and maintain applications |
|
||||
| [Kiwi.com](https://kiwi.com) | [@aexvir](https://github.com/aexvir) | Replacing the frontend of [The Zoo](https://github.com/kiwicom/the-zoo), their service registry. |
|
||||
| [Voi](https://www.voiscooters.com/) | [@K-Phoen](https://github.com/K-Phoen) | Developer portal, main gateway to our infrastructure, documentation and internal tooling. |
|
||||
| [Talkdesk](https://www.talkdesk.com) | [@jaime-talkdesk](https://github.com/jaime-talkdesk) | Initial work for Engineering Portal and Self Provisioning to R&D |
|
||||
| [Wealthsimple](https://www.wealthsimple.com) | [@andrewthauer](https://github.com/andrewthauer) | Developer portal, service catalog, documentation and tooling |
|
||||
| [Grab](https://www.grab.com) | [@althafh](https://github.com/althafh) | Initial work as a unified interface for all of Grab's internal tooling |
|
||||
| [Telenor Sweden](https://www.telenor.se) | [@O5ten](https://github.com/O5ten) | Building a developer portal for scaffolding projects towards our unified build environment and microservice stacks |
|
||||
| [Fiverr](https://www.fiverr.com) | [@nirga](https://github.com/nirga) | Unifying separate tools that developers are using today (i.e. monitoring, dead letter queues management, etc.) into a single platform. |
|
||||
| [Zalando SE](https://www.zalando.de) | [@leviferreira](https://github.com/leviferreira) | Building V2 of the Internal Development Portal. |
|
||||
| [LegalZoom](https://legalzoom.com) | [@backjo](https://github.com/backjo) | Developer portal - hub for all engineering projects and metadata. |
|
||||
| [Expedia Group](https://www.expediagroup.com) | [Mike Turner](mailto:miturner@expediagroup.com), [Sneha Kumar](mailto:snkumar@expediagroup.com), [@guillermomanzo](https://github.com/guillermomanzo), [Erik Lindgren](https://github.com/lindgren) | EG Common Developer Toolkit |
|
||||
| [Paddle.com](https://paddle.com) | [Ioannis Georgoulas](https://github.com/geototti21) | Developer portal (Tech Docs, Service Catalog, Internal Tooling), we use vanilla Backstage FE and custom BE implementation in Go |
|
||||
| [Acast.com](https://acast.com) | [Olle Lundberg](https://github.com/lndbrg) | Developer portal with tech docs, service catalog and a bunch of other internal tooling |
|
||||
| [Lunar](https://lunar.app) | [Jacob Valdemar](https://github.com/JacobValdemar) | Internal developer portal for service overview and insights, API documentation, technical guides, onboarding guides and RFC's. |
|
||||
| [Trendyol](https://trendyol.com) | [Erdogan Oksuz](https://github.com/erdoganoksuz) | The Developer Portal has been called `Pandora`. Provides an overview of Trendyol tech ecosystem. TechDocs, Catalog, Custom Plugins and Theme. |
|
||||
| [Peloton](https://www.onepeloton.com/) | [Jim Haughwout](https://github.com/JimHaughwout) | Creating our first developer portal and tech-docs. Exploring Service Catalog, Tech Insights and Cost Insights as well. |
|
||||
| [TELUS](https://telus.com) | [Seb Barre](https://github.com/sbarre) | The Go-to place to find answers about development and delivery at TELUS. |
|
||||
| [Brex](https://www.brex.com/) | [Vamsi Chitters](https://github.com/vamsikc) | A centralized UI to understand how a service fits in the whole Brex architecture and manage a team’s engineering dependencies. |
|
||||
| [Oriflame](https://www.oriflame.com/) | [Oriflame](https://github.com/oriflame) | Internal developer portal for services, single page apps and packages overview, API documentation, technical guides, tech-radar and more. |
|
||||
| [Booz Allen Hamilton](https://www.boozallen.com/) | [Jason Miller](https://github.com/JasonMiller-BAH) | Developer portal for a full-stack software development ecosystem that accelerates consistent and repeatable Modern Software Development practices for internal innovation and investments. |
|
||||
| [Netflix](https://www.netflix.com/) | [bleathem](https://github.com/bleathem) | Our Backstage implementation will be the front door to a unified experience connecting our internal platform products across important workflows with integrated knowledge and support. |
|
||||
| [b.well](https://www.icanbwell.com/) | [Jacob Rosales](https://github.com/jrosales) | Foundation for our engineering portal and cloud insights. |
|
||||
| [PagerDuty](https://www.pagerduty.com/) | [Mark Shaw](https://github.com/markshawtoronto) | Developer portal, initially focused on software templates and tech-docs. |
|
||||
| [MoonShiner](https://moonshiner.at) | [Fabian Hippmann](https://github.com/FabianHippmann) | Developer portal - helps us keep track of our customer projects, onboard new developers & improve our development process 🌕🚀🧑🚀 |
|
||||
| [FundApps](https://www.fundapps.co/) | [Elliot Greenwood](https://github.com/egnwd) | Developer Portal - A place for us to keep track of our projects and documentation for all services and processes |
|
||||
| [DAZN](https://dazn.com/) | [Lou Bichard](https://twitter.com/loujaybee), [Marco Crivellaro](https://github.com/crivetechie), [Alex Hollerith](mailto:alex.hollerith@dazn.com) | Ingesting all of DAZN's repos for the catalog, migrating our internal platform apps (pull request boards, release information, inner source marketplace etc) to Backstage plugins (where applicable). |
|
||||
| [HelloFresh](https://www.hellofresh.de/) | [@iammuho](https://github.com/iammuho), [@ElenaForester](https://github.com/ElenaForester), [@diegomarangoni](https://github.com/diegomarangoni) | Our developer portal at HelloFresh - Spread across an organisation of 500+ engineers globally. |
|
||||
|
||||
@@ -36,9 +36,33 @@ To become a maintainer you need to demonstrate the following:
|
||||
|
||||
If a maintainer is no longer interested or cannot perform the maintainer duties listed above, they should volunteer to be moved to emeritus status. In extreme cases this can also occur by a vote of the sponsors and maintainers per the voting process below.
|
||||
|
||||
# Reviewers
|
||||
|
||||
The project also contains a team called [@backstage/reviewers](https://github.com/orgs/backstage/teams/reviewers). This is the team of people who are the fallback in [`CODEOWNERS`](./.github/CODEOWNERS). This team will typically contain the maintainers, and a small number of additional people who are permitted to approve and merge pull requests. The purpose of this group is to offload some of the review work from the maintainers, simplifying and speeding up the review process for contributors.
|
||||
|
||||
This responsibility is distinct from the maintainer role. A reviewer must not approve and merge changes that have a level of impact that a maintainer should oversee; see below for clarification. For that class of changes, a reviewer can still review the pull request thoroughly without approving it (e.g. with a comment on the pull request), and is expected to notify `@backstage/maintainers` for final approval. Note that it is best to not use the GitHub review approve functionality for this, since that would let Hall of Fame members self-merge the pull request before maintainers get the chance to look at it.
|
||||
|
||||
The following is a non-exhaustive list of types of change, for which a reviewer should defer final decision and merge to a maintainer:
|
||||
|
||||
- A larger refactoring that significantly affects the structure of/between packages
|
||||
- Changes that settle or alter the trajectory of contested ongoing topics in issues or elsewhere
|
||||
- Changes that affect the [Architecture Decision Records](./docs/architecture-decisions)
|
||||
- Changes to APIs that have large customer impact, such as the core APIs in `@backstage/core-*` packages, or significant `@backstage/cli` changes.
|
||||
- Pull requests whose build checks are not passing fully
|
||||
- Additions and removals of entire packages
|
||||
- Releases (e.g. pull requests titled `Version Packages`)
|
||||
|
||||
A maintainer may suggest an addition to the reviewers team by opening a pull request that modifies [`OWNERS.md`](./OWNERS.md) accordingly. Prospective reviewers are not expected to do this themselves, but should rather ask a maintainer to sponsor their addition. All of the maintainers and sponsors are called to vote on the addition (see the section below about voting). If the vote passes, the pull request can be approved and merged, and the corresponding addition to the GitHub team can be made.
|
||||
|
||||
A reviewer can elect to remove themselves from the reviewers group by opening, or asking a maintainer to open, a pull request that modifies [`OWNERS.md`](./OWNERS.md) accordingly. A maintainer will approve and merge the pull request, and the corresponding removal from the GitHub team can be made.
|
||||
|
||||
A maintainer can call on the other maintainers and sponsors for a vote to remove a reviewer (see the section below about conflict resolution and voting). If the vote passes, a maintainer creates a pull request that modifies [`OWNERS.md`](./OWNERS.md) accordingly. After approval by another maintainer, the pull request can be merged, and the corresponding removal from the GitHub team can be made.
|
||||
|
||||
# Conflict resolution and voting
|
||||
|
||||
In general, we prefer that technical issues and maintainer membership are amicably worked out between the persons involved. If a dispute cannot be decided independently, the sponsors and maintainers can be called in to decide an issue. If the sponsors and maintainers themselves cannot decide an issue, the issue will be resolved by voting. The voting process is a simple majority in which each sponsor receives two votes and each maintainer receives one vote.
|
||||
In general, we prefer that technical issues and membership are amicably worked out between the persons involved. If a dispute cannot be decided independently, the sponsors and maintainers can be called in to decide an issue. If the sponsors and maintainers themselves cannot decide an issue, the issue will be resolved by voting.
|
||||
|
||||
In all cases in this document where voting is mentioned, the voting process is a simple majority in which each sponsor receives two votes and each maintainer receives one vote. If such a majority is reached, the vote is said to have _passed_.
|
||||
|
||||
# Adding new projects to the Backstage GitHub organization
|
||||
|
||||
|
||||
@@ -186,7 +186,7 @@ APPENDIX: How to apply the Apache License to your work.
|
||||
same "printed page" as the copyright notice for easier
|
||||
identification within third-party archives.
|
||||
|
||||
Copyright 2020 Spotify AB
|
||||
Copyright 2020 The Backstage Authors
|
||||
|
||||
Licensed under the Apache License, Version 2.0 (the "License");
|
||||
you may not use this file except in compliance with the License.
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
Backstage
|
||||
Copyright 2020 Spotify AB
|
||||
Copyright 2020 The Backstage Authors
|
||||
|
||||
Portions of this software were developed by third-party software vendors:
|
||||
- Tech Radar Plugin (https://opensource.zalando.com/tech-radar/), Copyright (c) 2017 Zalando SE
|
||||
|
||||
@@ -16,6 +16,18 @@ This page lists all active sponsors and maintainers.
|
||||
- Ben Lambert ([benjdlambert](https://github.com/benjdlambert)) (Discord: @blam)
|
||||
- Johan Haals ([jhaals](https://github.com/jhaals)) (Discord: @jhaals)
|
||||
|
||||
# Reviewers
|
||||
|
||||
See [`GOVERNANCE.md`](./GOVERNANCE.md) for details about how the reviewers team
|
||||
works.
|
||||
|
||||
- Patrik Oldsberg ([rugvip](https://github.com/rugvip)) (Discord: @Rugvip)
|
||||
- Fredrik Adelöw ([freben](https://github.com/freben)) (Discord: @freben)
|
||||
- Ben Lambert ([benjdlambert](https://github.com/benjdlambert)) (Discord: @blam)
|
||||
- Johan Haals ([jhaals](https://github.com/jhaals)) (Discord: @jhaals)
|
||||
- Himanshu Mishra ([OrkoHunter](https://github.com/OrkoHunter)) (Discord: @OrkoHunter)
|
||||
- Tim Hansen ([timbonicus](https://github.com/timbonicus)) (Discord: @timbonicus)
|
||||
|
||||
# Emeritus maintainers
|
||||
|
||||
- Stefan Ålund ([stefanalund](https://github.com/stefanalund)) (Discord: @stalund)
|
||||
|
||||
@@ -12,15 +12,15 @@
|
||||
|
||||
## What is Backstage?
|
||||
|
||||
[Backstage](https://backstage.io/) is an open platform for building developer portals. Powered by a centralized service catalog, Backstage restores order to your microservices and infrastructure and enables your product teams to ship high-quality code quickly — without compromising autonomy.
|
||||
[Backstage](https://backstage.io/) is an open platform for building developer portals. Powered by a centralized software catalog, Backstage restores order to your microservices and infrastructure and enables your product teams to ship high-quality code quickly — without compromising autonomy.
|
||||
|
||||
Backstage unifies all your infrastructure tooling, services, and documentation to create a streamlined development environment from end to end.
|
||||
|
||||

|
||||

|
||||
|
||||
Out of the box, Backstage includes:
|
||||
|
||||
- [Backstage Service Catalog](https://backstage.io/docs/features/software-catalog/software-catalog-overview) for managing all your software (microservices, libraries, data pipelines, websites, ML models, etc.)
|
||||
- [Backstage Software Catalog](https://backstage.io/docs/features/software-catalog/software-catalog-overview) for managing all your software (microservices, libraries, data pipelines, websites, ML models, etc.)
|
||||
- [Backstage Software Templates](https://backstage.io/docs/features/software-templates/software-templates-index) for quickly spinning up new projects and standardizing your tooling with your organization’s best practices
|
||||
- [Backstage TechDocs](https://backstage.io/docs/features/techdocs/techdocs-overview) for making it easy to create, maintain, find, and use technical documentation, using a "docs like code" approach
|
||||
- Plus, a growing ecosystem of [open source plugins](https://github.com/backstage/backstage/tree/master/plugins) that further expand Backstage’s customizability and functionality
|
||||
@@ -38,7 +38,7 @@ Check out [the documentation](https://backstage.io/docs/getting-started) on how
|
||||
## Documentation
|
||||
|
||||
- [Main documentation](https://backstage.io/docs)
|
||||
- [Service Catalog](https://backstage.io/docs/features/software-catalog/software-catalog-overview)
|
||||
- [Software Catalog](https://backstage.io/docs/features/software-catalog/software-catalog-overview)
|
||||
- [Architecture](https://backstage.io/docs/overview/architecture-overview) ([Decisions](https://backstage.io/docs/architecture-decisions/adrs-overview))
|
||||
- [Designing for Backstage](https://backstage.io/docs/dls/design)
|
||||
- [Storybook - UI components](https://backstage.io/storybook)
|
||||
|
||||
@@ -72,7 +72,7 @@ proxy:
|
||||
'/pagerduty':
|
||||
target: https://api.pagerduty.com
|
||||
headers:
|
||||
Authorization: ${PAGERDUTY_TOKEN}
|
||||
Authorization: Token token=${PAGERDUTY_TOKEN}
|
||||
|
||||
'/buildkite/api':
|
||||
target: https://api.buildkite.com/v2/
|
||||
|
||||
@@ -4,7 +4,7 @@ The Backstage backend APIs are by default available without authentication. To a
|
||||
|
||||
API requests from frontend plugins include an authorization header with a Backstage identity token acquired when the user logs in. By adding a middleware that verifies said token to be valid and signed by Backstage, non-authenticated requests can be blocked with a 401 Unauthorized response.
|
||||
|
||||
Note that this means Backstage will stop working for guests, as no token is issued for them.
|
||||
**NOTE**: Enabling this means that Backstage will stop working for guests, as no token is issued for them.
|
||||
|
||||
As techdocs HTML pages load assets without an Authorization header the code below also sets a token cookie when the user logs in (and when the token is about to expire).
|
||||
|
||||
@@ -99,7 +99,7 @@ async function main() {
|
||||
```typescript
|
||||
// packages/app/src/App.tsx from a create-app deployment
|
||||
|
||||
import { discoveryApiRef, useApi } from '@backstage/core';
|
||||
import { discoveryApiRef, useApi } from '@backstage/core-plugin-api';
|
||||
|
||||
// ...
|
||||
|
||||
@@ -181,3 +181,83 @@ const app = createApp({
|
||||
|
||||
// ...
|
||||
```
|
||||
|
||||
**NOTE**: Most Backstage frontend plugins come with the support for the `IdentityApi`.
|
||||
In case you already have a dozen of internal ones, you may need to update those too.
|
||||
Assuming you follow the common plugin structure, the changes to your front-end may look like:
|
||||
|
||||
```diff
|
||||
// plugins/internal-plugin/src/api.ts
|
||||
- import {createApiRef} from '@backstage/core';
|
||||
+ import {createApiRef, IdentityApi} from '@backstage/core';
|
||||
import {Config} from '@backstage/config';
|
||||
// ...
|
||||
|
||||
type MyApiOptions = {
|
||||
configApi: Config;
|
||||
+ identityApi: IdentityApi;
|
||||
// ...
|
||||
}
|
||||
|
||||
interface MyInterface {
|
||||
getData(): Promise<MyData[]>;
|
||||
}
|
||||
|
||||
export class MyApi implements MyInterface {
|
||||
private configApi: Config;
|
||||
+ private identityApi: IdentityApi;
|
||||
// ...
|
||||
|
||||
constructor(options: MyApiOptions) {
|
||||
this.configApi = options.configApi;
|
||||
+ this.identityApi = options.identityApi;
|
||||
}
|
||||
|
||||
async getMyData() {
|
||||
const backendUrl = this.configApi.getString('backend.baseUrl');
|
||||
|
||||
+ const token = await this.identityApi.getIdToken();
|
||||
const requestUrl = `${backendUrl}/api/data/`;
|
||||
- const response = await fetch(requestUrl);
|
||||
+ const response = await fetch(
|
||||
requestUrl,
|
||||
{ headers: { Authorization: `Bearer ${token}` } },
|
||||
);
|
||||
// ...
|
||||
}
|
||||
```
|
||||
|
||||
and
|
||||
|
||||
```diff
|
||||
// plugins/internal-plugin/src/plugin.ts
|
||||
|
||||
import {
|
||||
configApiRef,
|
||||
createApiFactory,
|
||||
createPlugin,
|
||||
+ identityApiRef,
|
||||
} from '@backstage/core';
|
||||
import {mypluginPageRouteRef} from './routeRefs';
|
||||
import {MyApi, myApiRef} from './api';
|
||||
|
||||
export const plugin = createPlugin({
|
||||
id: 'my-plugin',
|
||||
routes: {
|
||||
mainPage: mypluginPageRouteRef,
|
||||
},
|
||||
apis: [
|
||||
createApiFactory({
|
||||
api: myApiRef,
|
||||
deps: {
|
||||
configApi: configApiRef,
|
||||
+ identityApi: identityApiRef,
|
||||
},
|
||||
- factory: ({configApi}) =>
|
||||
- new MyApi({ configApi }),
|
||||
+ factory: ({configApi, identityApi}) =>
|
||||
+ new MyApi({ configApi, identityApi }),
|
||||
}),
|
||||
],
|
||||
});
|
||||
```
|
||||
|
||||
@@ -51,7 +51,7 @@ The Backstage App needs a SignInPage when authentication is required.
|
||||
When using ALB authentication Backstage will only be loaded once the user has successfully authenticated; we won't need to display a SignIn page, however we will need to create a dummy SignIn component that can refresh the token.
|
||||
|
||||
- edit `packages/app/src/App.tsx`
|
||||
- import the following two additional definitions from `@backstage/core`: `useApi`, `configApiRef`; these will be used to check whether Backstage is running locally or behind an ALB
|
||||
- import the following two additional definitions from `@backstage/core-plugin-api`: `useApi`, `configApiRef`; these will be used to check whether Backstage is running locally or behind an ALB
|
||||
- add the following definition just before the app is created (`const app = createApp`):
|
||||
|
||||
```ts
|
||||
|
||||
@@ -26,6 +26,7 @@ import 'global-agent/bootstrap';
|
||||
|
||||
```sh
|
||||
export GLOBAL_AGENT_HTTP_PROXY=$HTTP_PROXY
|
||||
export GLOBAL_AGENT_NO_PROXY=$NO_PROXY
|
||||
yarn start
|
||||
```
|
||||
|
||||
|
||||
@@ -5,6 +5,7 @@ ExampleComponent.tsx reference
|
||||
```tsx
|
||||
import React from 'react';
|
||||
import { Typography, Grid } from '@material-ui/core';
|
||||
import { identityApiRef, useApi } from '@backstage/core-plugin-api';
|
||||
import {
|
||||
InfoCard,
|
||||
Header,
|
||||
@@ -13,12 +14,10 @@ import {
|
||||
ContentHeader,
|
||||
HeaderLabel,
|
||||
SupportButton,
|
||||
identityApiRef,
|
||||
useApi,
|
||||
} from '@backstage/core';
|
||||
import ExampleFetchComponent from '../ExampleFetchComponent';
|
||||
} from '@backstage/core-components';
|
||||
import { ExampleFetchComponent } from '../ExampleFetchComponent';
|
||||
|
||||
const ExampleComponent = () => {
|
||||
export const ExampleComponent = () => {
|
||||
const identityApi = useApi(identityApiRef);
|
||||
const userId = identityApi.getUserId();
|
||||
const profile = identityApi.getProfile();
|
||||
@@ -52,6 +51,4 @@ const ExampleComponent = () => {
|
||||
</Page>
|
||||
);
|
||||
};
|
||||
|
||||
export default ExampleComponent;
|
||||
```
|
||||
|
||||
@@ -6,13 +6,8 @@ ExampleFetchComponent.tsx reference
|
||||
import React from 'react';
|
||||
import { useAsync } from 'react-use';
|
||||
import Alert from '@material-ui/lab/Alert';
|
||||
import {
|
||||
Table,
|
||||
TableColumn,
|
||||
Progress,
|
||||
githubAuthApiRef,
|
||||
useApi,
|
||||
} from '@backstage/core';
|
||||
import { githubAuthApiRef, useApi } from '@backstage/core-plugin-api';
|
||||
import { Table, TableColumn, Progress } from '@backstage/core-components';
|
||||
import { graphql } from '@octokit/graphql';
|
||||
|
||||
const query = `{
|
||||
@@ -76,7 +71,7 @@ export const DenseTable = ({ viewer }: DenseTableProps) => {
|
||||
);
|
||||
};
|
||||
|
||||
const ExampleFetchComponent = () => {
|
||||
export const ExampleFetchComponent = () => {
|
||||
const auth = useApi(githubAuthApiRef);
|
||||
|
||||
const { value, loading, error } = useAsync(async (): Promise<any> => {
|
||||
@@ -106,6 +101,4 @@ const ExampleFetchComponent = () => {
|
||||
/>
|
||||
);
|
||||
};
|
||||
|
||||
export default ExampleFetchComponent;
|
||||
```
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
/*
|
||||
* Copyright 2021 Spotify AB
|
||||
* Copyright 2021 The Backstage Authors
|
||||
*
|
||||
* Licensed under the Apache License, Version 2.0 (the "License");
|
||||
* you may not use this file except in compliance with the License.
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
/*
|
||||
* Copyright 2021 Spotify AB
|
||||
* Copyright 2021 The Backstage Authors
|
||||
*
|
||||
* Licensed under the Apache License, Version 2.0 (the "License");
|
||||
* you may not use this file except in compliance with the License.
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
/*
|
||||
* Copyright 2021 Spotify AB
|
||||
* Copyright 2021 The Backstage Authors
|
||||
*
|
||||
* Licensed under the Apache License, Version 2.0 (the "License");
|
||||
* you may not use this file except in compliance with the License.
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
/*
|
||||
* Copyright 2021 Spotify AB
|
||||
* Copyright 2021 The Backstage Authors
|
||||
*
|
||||
* Licensed under the Apache License, Version 2.0 (the "License");
|
||||
* you may not use this file except in compliance with the License.
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
/*
|
||||
* Copyright 2021 Spotify AB
|
||||
* Copyright 2021 The Backstage Authors
|
||||
*
|
||||
* Licensed under the Apache License, Version 2.0 (the "License");
|
||||
* you may not use this file except in compliance with the License.
|
||||
|
||||
@@ -23,18 +23,18 @@ during their entire life cycle.
|
||||
Each Utility API is tied to an `ApiRef` instance, which is a global singleton
|
||||
object without any additional state or functionality, its only purpose is to
|
||||
reference Utility APIs. `ApiRef`s are created using `createApiRef`, which is
|
||||
exported by `@backstage/core`. There are many
|
||||
exported by `@backstage/core-plugin-api`. There are many
|
||||
[predefined Utility APIs](../reference/utility-apis/README.md) defined in
|
||||
`@backstage/core`, and they're all exported with a name of the pattern
|
||||
`*ApiRef`, for example `errorApiRef`.
|
||||
`@backstage/core-plugin-api`, and they're all exported with a name of the
|
||||
pattern `*ApiRef`, for example `errorApiRef`.
|
||||
|
||||
To access one of the Utility APIs inside a React component, use the `useApi`
|
||||
hook exported by `@backstage/core`, or the `withApis` HOC if you prefer class
|
||||
components. For example, the `ErrorApi` can be accessed like this:
|
||||
hook exported by `@backstage/core-plugin-api`, or the `withApis` HOC if you
|
||||
prefer class components. For example, the `ErrorApi` can be accessed like this:
|
||||
|
||||
```tsx
|
||||
import React from 'react';
|
||||
import { useApi, errorApiRef } from '@backstage/core';
|
||||
import { useApi, errorApiRef } from '@backstage/core-plugin-api';
|
||||
|
||||
export const MyComponent = () => {
|
||||
const errorApi = useApi(errorApiRef);
|
||||
@@ -52,9 +52,9 @@ Note that there is no explicit type given for `ErrorApi`. This is because the
|
||||
`errorApiRef` has the type embedded, and `useApi` is able to infer the type.
|
||||
|
||||
Also note that consuming Utility APIs is not limited to plugins, it can be done
|
||||
from any component inside Backstage, including the ones in `@backstage/core`.
|
||||
The only requirement is that they are beneath the `AppProvider` in the react
|
||||
tree.
|
||||
from any component inside Backstage, including the ones in
|
||||
`@backstage/core-plugin-api`. The only requirement is that they are beneath the
|
||||
`AppProvider` in the react tree.
|
||||
|
||||
## Supplying APIs
|
||||
|
||||
@@ -71,8 +71,11 @@ For example, this is the default `ApiFactory` for the `ErrorApi`:
|
||||
createApiFactory({
|
||||
api: errorApiRef,
|
||||
deps: { alertApi: alertApiRef },
|
||||
factory: ({ alertApi }) =>
|
||||
new ErrorAlerter(alertApi, new ErrorApiForwarder()),
|
||||
factory: ({ alertApi }) => {
|
||||
const errorApi = new ErrorAlerter(alertApi, new ErrorApiForwarder());
|
||||
UnhandledErrorForwarder.forward(errorApi, { hidden: false });
|
||||
return errorApi;
|
||||
},
|
||||
});
|
||||
```
|
||||
|
||||
@@ -98,13 +101,13 @@ app, and the app itself.
|
||||
### Core APIs
|
||||
|
||||
Starting with the Backstage core library, it provides implementations for all of
|
||||
the core APIs. The core APIs are the ones exported by `@backstage/core`, such as
|
||||
the `errorApiRef` and `configApiRef`. You can find a full list of them
|
||||
[here](../reference/utility-apis/README.md).
|
||||
the core APIs. The core APIs are the ones exported by
|
||||
`@backstage/core-plugin-api`, such as the `errorApiRef` and `configApiRef`. You
|
||||
can find a full list of them [here](../reference/utility-apis/README.md).
|
||||
|
||||
The core APIs are loaded for any app created with `createApp` from
|
||||
`@backstage/core`, which means that there is no step that needs to be taken to
|
||||
include these APIs in an app.
|
||||
`@backstage/core-plugin-api`, which means that there is no step that needs to be
|
||||
taken to include these APIs in an app.
|
||||
|
||||
### Plugin APIs
|
||||
|
||||
@@ -210,8 +213,9 @@ implement the `ErrorApi`, as it is checked by the type embedded in the
|
||||
|
||||
Plugins are free to define their own Utility APIs. Simply define the TypeScript
|
||||
interface for the API, and create an `ApiRef` using `createApiRef` exported from
|
||||
`@backstage/core`. Also be sure to provide at least one implementation of the
|
||||
API, and to declare a default factory for the API in `createPlugin`.
|
||||
`@backstage/core-plugin-api`. Also be sure to provide at least one
|
||||
implementation of the API, and to declare a default factory for the API in
|
||||
`createPlugin`.
|
||||
|
||||
Custom Utility APIs can be either public or private, which is up to the plugin
|
||||
to choose. Private APIs do not expose an external API surface, and it's
|
||||
|
||||
@@ -6,8 +6,8 @@ description: Architecture Decision Record (ADR) log on Module Export Structure
|
||||
|
||||
## Context
|
||||
|
||||
With a growing number of exports of packages like `@backstage/core`, it is
|
||||
becoming more and more difficult to answer questions such as
|
||||
With a growing number of exports of packages like `@backstage/core-components`,
|
||||
it is becoming more and more difficult to answer questions such as
|
||||
|
||||
> Is the export in this module also exported by the package?
|
||||
|
||||
@@ -86,7 +86,7 @@ import { helperFunc } from '../../lib/UtilityX/helper';
|
||||
## Consequences
|
||||
|
||||
We will actively work to rework the export structure in our codebase,
|
||||
prioritizing the library packages such as `@backstage/core` and
|
||||
prioritizing the library packages such as `@backstage/core-components` and
|
||||
`@backstage/backend-common`.
|
||||
|
||||
If possible, we will add tools, such as lint rules, to help enforce the export
|
||||
|
||||
@@ -35,6 +35,8 @@ example `catalog` or `techdocs`):
|
||||
|
||||
- `x`: Contains the main frontend code of the plugin.
|
||||
- `x-backend`: Contains the main backend code of the plugin.
|
||||
- `x-backend-module-<name>`: Contains optional modules related to the backend
|
||||
plugin.
|
||||
- `x-react`: Contains shared widgets, hooks and similar that both the plugin
|
||||
itself (`x`) and third-party frontend plugins can depend on.
|
||||
- `x-node`: Contains utilities for backends that both the plugin backend itself
|
||||
@@ -61,6 +63,10 @@ We will actively migrate existing packages that are part of a plugin to the
|
||||
`plugins/catalog-common` we might want to do an exception here, as it's a very
|
||||
central package.
|
||||
|
||||
We will actively migrate optional features of backend plugins into separate
|
||||
`x-backend-module-<name>` packages, for example the more specialized processors
|
||||
in the catalog backend.
|
||||
|
||||
The limited set of rules might not be sufficient in the future. If additional
|
||||
packages are required, we will revisit this decision and extend the pattern.
|
||||
|
||||
|
||||
|
Before Width: | Height: | Size: 303 KiB After Width: | Height: | Size: 303 KiB |
@@ -0,0 +1,150 @@
|
||||
---
|
||||
id: identity-resolver
|
||||
title: Identity resolver
|
||||
description: Identity resolvers of Backstage users after they sign-in
|
||||
---
|
||||
|
||||
This guide explains how the identity of a Backstage user is stored inside their
|
||||
Backstage Identity Token and how you can customize the Sign-In resolvers to
|
||||
include identity and group membership information of the user from other
|
||||
external systems. This ultimately helps with determining the ownership of a
|
||||
Backstage entity by a user. The ideas here were originally proposed in the RFC
|
||||
[#4089](https://github.com/backstage/backstage/issues/4089).
|
||||
|
||||
When a user signs in to Backstage, inside the `claims` field of their Backstage
|
||||
Token (which are standard JWT tokens) a special `ent` claim is set. `ent`
|
||||
contains a list of
|
||||
[entity references](../features/software-catalog/references.md), each of which
|
||||
denotes an identity or a membership that is relevant to the user. There is no
|
||||
guarantee that these correspond to actual existing catalog entities.
|
||||
|
||||
Let's take an example sign-in resolver for the Google auth provider and explore
|
||||
how the `ent` field inside `claims` can be set.
|
||||
|
||||
Inside your `packages/backend/src/plugins/auth.ts` file, you can provide custom
|
||||
sign-in resolvers and set them for any of the Authentication providers inside
|
||||
`providerFactories` of the `createRouter` imported from the
|
||||
`@backstage/plugin-auth-backend` plugin.
|
||||
|
||||
```ts
|
||||
export default async function createPlugin({
|
||||
...
|
||||
}: PluginEnvironment): Promise<Router> {
|
||||
return await createRouter({
|
||||
...
|
||||
providerFactories: {
|
||||
google: createGoogleProvider({
|
||||
signIn: {
|
||||
resolver: async ({ profile: { email } }, ctx) => {
|
||||
// Call a custom validator function that checks that the email is
|
||||
// valid and on our own company's domain, and throws an Error if it
|
||||
// isn't
|
||||
validateEmail(email);
|
||||
|
||||
// List of entity references that denote the identity and
|
||||
// membership of the user
|
||||
const ent = [];
|
||||
|
||||
// Let's use the username in the email ID as the user's default
|
||||
// unique identifier inside Backstage.
|
||||
const [id] = email.split('@');
|
||||
ent.push(`User:default/${id}`)
|
||||
|
||||
// Let's call the internal LDAP provider to get a list of groups
|
||||
// that the user belongs to, and add those to the list as well
|
||||
const ldapGroups = await getLdapGroups(email);
|
||||
ldapGroups.forEach(group => ent.push(`Group:default/${group}`))
|
||||
|
||||
// Issue the token containing the entity claims
|
||||
const token = await ctx.tokenIssuer.issueToken({
|
||||
claims: { sub: id, ent },
|
||||
});
|
||||
return { id, token };
|
||||
},
|
||||
},
|
||||
}),
|
||||
},
|
||||
});
|
||||
}
|
||||
```
|
||||
|
||||
As you can see, the generated Backstage Token now contains all the claims about
|
||||
the identity and membership of the user. Once the sign-in process is complete,
|
||||
and we need to find out if a user owns an Entity in the Software Catalog, these
|
||||
`ent` claims can be used to determine the ownership.
|
||||
|
||||
According to the RFC, the definition of the ownership of an entity E, for a user
|
||||
U, is as follows:
|
||||
|
||||
- Get all the `ownedBy` relations of E, and call them O
|
||||
- Get all the claims of the user U and call them C
|
||||
- If any C matches any O, return `true`
|
||||
- Get all Group entities that U is a member of, using the regular
|
||||
`memberOf`/`hasMember` relation mechanism, and call them G
|
||||
- If any G matches any O, return `true`
|
||||
- Otherwise, return `false`
|
||||
|
||||
## Default sign-in resolvers
|
||||
|
||||
Of course you don't have to customize the sign-in resolver if you don't need to.
|
||||
The Auth backend plugin comes with a set of default sign-in resolvers which you
|
||||
can use. For example - the Google provider has a default email-based sign-in
|
||||
resolver, which will search the catalog for a single user entity that has a
|
||||
matching `google.com/email` annotation.
|
||||
|
||||
It can be enabled like this
|
||||
|
||||
```tsx
|
||||
// File: packages/backend/src/plugins/auth.ts
|
||||
import { googleEmailSignInResolver } from '@backstage/plugin-auth-backend';
|
||||
|
||||
export default async function createPlugin({
|
||||
...
|
||||
}: PluginEnvironment): Promise<Router> {
|
||||
return await createRouter({
|
||||
...
|
||||
providerFactories: {
|
||||
google: createGoogleProvider({
|
||||
signIn: {
|
||||
resolver: googleEmailSignInResolver
|
||||
}
|
||||
...
|
||||
```
|
||||
|
||||
## AuthHandler
|
||||
|
||||
Similar to a custom sign-in resolver, you can also write a custom auth handler
|
||||
function which is used to verify and convert the auth response into the profile
|
||||
that will be presented to the user. This is where you can customize things like
|
||||
display name and profile picture.
|
||||
|
||||
This is also the place where you can do authorization and validation of the user
|
||||
and throw errors if the user should not be allowed access in Backstage.
|
||||
|
||||
```tsx
|
||||
// File: packages/backend/src/plugins/auth.ts
|
||||
export default async function createPlugin({
|
||||
...
|
||||
}: PluginEnvironment): Promise<Router> {
|
||||
return await createRouter({
|
||||
...
|
||||
providerFactories: {
|
||||
google: createGoogleProvider({
|
||||
authHandler: async ({
|
||||
fullProfile // Type: passport.Profile,
|
||||
idToken // Type: (Optional) string,
|
||||
}) => {
|
||||
// Custom validation code goes here
|
||||
return {
|
||||
profile: {
|
||||
email,
|
||||
picture,
|
||||
displayName,
|
||||
}
|
||||
};
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
}
|
||||
```
|
||||
@@ -66,7 +66,8 @@ built-in providers:
|
||||
|
||||
```diff
|
||||
# packages/app/src/App.tsx
|
||||
+ import { githubAuthApiRef, SignInProviderConfig, SignInPage } from '@backstage/core';
|
||||
+ import { githubAuthApiRef } from '@backstage/core-plugin-api';
|
||||
+ import { SignInProviderConfig, SignInPage } from '@backstage/core-components';
|
||||
|
||||
+ const githubProvider: SignInProviderConfig = {
|
||||
+ id: 'github-auth-provider',
|
||||
|
||||
@@ -14,7 +14,7 @@ to various third party APIs.
|
||||
There are occasions when the user wants to perform actions towards third party
|
||||
services that require authorization via OAuth. Backstage provides standardized
|
||||
[Utility APIs](../api/utility-apis.md) such as the
|
||||
[GoogleAuthApi](https://github.com/backstage/backstage/blob/master/packages/core-api/src/apis/definitions/auth.ts)
|
||||
[GoogleAuthApi](https://github.com/backstage/backstage/blob/master/packages/core-plugin-api/src/apis/definitions/auth.ts)
|
||||
for that use-case. Backstage also includes a set of implementations of these
|
||||
APIs that integrate with the
|
||||
[auth-backend](https://github.com/backstage/backstage/tree/master/plugins/auth-backend)
|
||||
@@ -38,7 +38,7 @@ choose an account to log in with, and accept or reject the request. If the user
|
||||
accepts the login request, a token is issued, and any holder of the token can
|
||||
use it to make authenticated requests towards the third party service.
|
||||
|
||||
## OAuth in @backstage/core-api and auth-backend
|
||||
## OAuth in @backstage/core-app-api and auth-backend
|
||||
|
||||
The default OAuth implementation in Backstage is based on an OAuth server-side
|
||||
offline access flow, which means that it uses the backend as a helper in order
|
||||
@@ -59,8 +59,8 @@ easier to make authenticated requests inside a plugin.
|
||||
The following describes the OAuth flow implemented by the
|
||||
[auth-backend](https://github.com/backstage/backstage/tree/master/plugins/auth-backend)
|
||||
and
|
||||
[DefaultAuthConnector](https://github.com/backstage/backstage/blob/master/packages/core-api/src/lib/AuthConnector/DefaultAuthConnector.ts)
|
||||
in `@backstage/core-api`.
|
||||
[DefaultAuthConnector](https://github.com/backstage/backstage/blob/master/packages/core-app-api/src/lib/AuthConnector/DefaultAuthConnector.ts)
|
||||
in `@backstage/core-app-api`.
|
||||
|
||||
Component and APIs can request Access or ID Tokens from any available Auth
|
||||
provider. If there already exists a cached fresh token that covers (at least)
|
||||
|
||||
@@ -45,8 +45,8 @@ pieces in place that can be used.
|
||||
#### Identity for Plugin Developers
|
||||
|
||||
As a plugin developer, there are two main touchpoints for identities: the
|
||||
`IdentityApi` exported by `@backstage/core` via the `identityApiRef`, and a not
|
||||
yet existing middleware exported by `@backstage/backend-common`.
|
||||
`IdentityApi` exported by `@backstage/core-plugin-api` via the `identityApiRef`,
|
||||
and a not yet existing middleware exported by `@backstage/backend-common`.
|
||||
|
||||
The `IdentityApi` gives access to the signed-in user's identity in the frontend.
|
||||
It provides access to the user's ID, lightweight profile information, and an ID
|
||||
@@ -61,8 +61,9 @@ https://github.com/backstage/backstage/issues/1435.
|
||||
|
||||
If you're setting up your own Backstage app, or want to add a new identity
|
||||
provider, there are three touchpoints: the frontend auth APIs in
|
||||
`@backstage/core-api`, the backend auth providers in `auth-backend`, and the
|
||||
`SignInPage` component configured in the Backstage app via `createApp`.
|
||||
`@backstage/core-app-api` and `@backstage/core-plugin-api`, the backend auth
|
||||
providers in `auth-backend`, and the `SignInPage` component configured in the
|
||||
Backstage app via `createApp`.
|
||||
|
||||
The frontend APIs and backend providers are tightly coupled together for each
|
||||
auth provider, and together they implement an e2e auth flow. Only some auth
|
||||
@@ -81,10 +82,10 @@ The final piece of the puzzle is the `SignInPage` component that can be
|
||||
configured as part of the app. Without a sign-in page, Backstage will fall back
|
||||
to a `guest` identity for all users, without any ID token. To enable sign-in, a
|
||||
`SignInPage` needs to be configured, which in turn has to supply a user to the
|
||||
app. The `@backstage/core` package provides a basic sign-in page that allows
|
||||
both the user and the app developer to choose between a couple of different
|
||||
sign-in methods, or to designate a single provider that may also be logged in to
|
||||
automatically.
|
||||
app. The `@backstage/core-components` package provides a basic sign-in page that
|
||||
allows both the user and the app developer to choose between a couple of
|
||||
different sign-in methods, or to designate a single provider that may also be
|
||||
logged in to automatically.
|
||||
|
||||
## Further Reading
|
||||
|
||||
|
||||
@@ -554,9 +554,7 @@ Options:
|
||||
Scope: `root`
|
||||
|
||||
Validate `@backstage` dependencies within the repo, making sure that there are
|
||||
no duplicates of packages that might lead to breakages. For example,
|
||||
`@backstage/core` must not be loaded in twice, so having two different versions
|
||||
of it installed will cause this command to exit with an error.
|
||||
no duplicates of packages that might lead to breakages.
|
||||
|
||||
By supplying the `--fix` flag the command will attempt to fix any conflict that
|
||||
can be resolved by editing `yarn.lock`, but will not attempt to search for
|
||||
|
||||
@@ -93,6 +93,21 @@ declare the visibility of a leaf node of `type: "string"`.
|
||||
| `backend` | (Default) Only in backend |
|
||||
| `secret` | Only in backend and may be excluded from logs for security reasons |
|
||||
|
||||
You can set visibility with an `@visibility` comment in the `Config` Typescript
|
||||
interface.
|
||||
|
||||
```ts
|
||||
export interface Config {
|
||||
app: {
|
||||
/**
|
||||
* Frontend root URL
|
||||
* @visibility frontend
|
||||
*/
|
||||
baseUrl: string;
|
||||
};
|
||||
}
|
||||
```
|
||||
|
||||
## Validation
|
||||
|
||||
Schemas can be validated using the `backstage-cli config:check` command. If you
|
||||
|
||||
@@ -112,7 +112,7 @@ example `getString`. These will throw an error if there is no value available.
|
||||
|
||||
The [ConfigApi](../reference/utility-apis/Config.md) in the frontend is a
|
||||
[UtilityApi](../api/utility-apis.md). It's accessible as usual via the
|
||||
`configApiRef` exported from `@backstage/core`.
|
||||
`configApiRef` exported from `@backstage/core-plugin-api`.
|
||||
|
||||
Depending on the config api in another API is slightly different though, as the
|
||||
`ConfigApi` implementation is supplied via the App itself and not instantiated
|
||||
@@ -123,7 +123,7 @@ for an example of how this wiring is done.
|
||||
For standalone plugin setups in `dev/index.ts`, register a factory with a
|
||||
statically mocked implementation of the config API. Use the `ConfigReader` from
|
||||
`@backstage/config` to create an instance and register it for the `configApiRef`
|
||||
from `@backstage/core`.
|
||||
from `@backstage/core-plugin-api`.
|
||||
|
||||
## Accessing ConfigApi in Backend Plugins
|
||||
|
||||
|
||||
@@ -25,7 +25,7 @@ component, which are then displayed both visually and with sample code to be
|
||||
copied.
|
||||
|
||||
When custom Backstage components are created, they are placed in the
|
||||
`@backstage/core` package and added to the Storybook.
|
||||
`@backstage/core-components` package and added to the Storybook.
|
||||
|
||||
There may be times where an existing Material-UI component (in
|
||||
`@material-ui/core`) is sufficient and doesn't need to be wrapped or duplicated.
|
||||
|
||||
@@ -68,7 +68,7 @@ The base URL to the Kubernetes control plane. Can be found by using the
|
||||
##### `clusters.\*.name`
|
||||
|
||||
A name to represent this cluster, this must be unique within the `clusters`
|
||||
array. Users will see this value in the Service Catalog Kubernetes plugin.
|
||||
array. Users will see this value in the Software Catalog Kubernetes plugin.
|
||||
|
||||
##### `clusters.\*.authProvider`
|
||||
|
||||
@@ -195,7 +195,7 @@ annotations:
|
||||
|
||||
#### Labeling Kubernetes components
|
||||
|
||||
In order for Kubernetes components to show up in the service catalog as a part
|
||||
In order for Kubernetes components to show up in the software catalog as a part
|
||||
of an entity, Kubernetes components themselves can have the following label:
|
||||
|
||||
```yaml
|
||||
|
||||
@@ -2,7 +2,7 @@
|
||||
id: overview
|
||||
title: Kubernetes
|
||||
sidebar_label: Overview
|
||||
description: Monitoring Kubernetes based services with the service catalog
|
||||
description: Monitoring Kubernetes based services with the software catalog
|
||||
---
|
||||
|
||||
Kubernetes in Backstage is a tool that's designed around the needs of service
|
||||
|
||||
@@ -29,7 +29,7 @@ Backstage app with the following contents:
|
||||
|
||||
```tsx
|
||||
import React from 'react';
|
||||
import { Content, Header, Page } from '@backstage/core';
|
||||
import { Content, Header, Page } from '@backstage/core-components';
|
||||
import { Grid, List, Card, CardContent } from '@material-ui/core';
|
||||
import {
|
||||
SearchBar,
|
||||
|
||||
@@ -1,29 +1,29 @@
|
||||
---
|
||||
id: software-catalog-overview
|
||||
title: Backstage Service Catalog (alpha)
|
||||
title: Backstage Software Catalog (alpha)
|
||||
sidebar_label: Overview
|
||||
# prettier-ignore
|
||||
description: The Backstage Service Catalog — actually, a software catalog, since it includes more than just services
|
||||
description: The Backstage Software Catalog
|
||||
---
|
||||
|
||||
## What is a Service Catalog?
|
||||
## What is a Software Catalog?
|
||||
|
||||
The Backstage Service Catalog — actually, a software catalog, since it includes
|
||||
The Backstage Software Catalog — actually, a software catalog, since it includes
|
||||
more than just services — is a centralized system that keeps track of ownership
|
||||
and metadata for all the software in your ecosystem (services, websites,
|
||||
libraries, data pipelines, etc). The catalog is built around the concept of
|
||||
[metadata YAML files](descriptor-format.md) stored together with the code, which
|
||||
are then harvested and visualized in Backstage.
|
||||
|
||||

|
||||

|
||||
|
||||
## How it works
|
||||
|
||||
Backstage and the Backstage Service Catalog make it easy for one team to manage
|
||||
Backstage and the Backstage Software Catalog make it easy for one team to manage
|
||||
10 services — and makes it possible for your company to manage thousands of
|
||||
them.
|
||||
|
||||
More specifically, the Service Catalog enables two main use-cases:
|
||||
More specifically, the Software Catalog enables two main use-cases:
|
||||
|
||||
1. Helping teams manage and maintain the software they own. Teams get a uniform
|
||||
view of all their software; services, libraries, websites, ML models — you
|
||||
@@ -34,15 +34,14 @@ More specifically, the Service Catalog enables two main use-cases:
|
||||
## Getting Started
|
||||
|
||||
The Software Catalog is available to browse at `/catalog`. If you've followed
|
||||
[Installing in your Backstage App](./installation.md) in your separate App or
|
||||
[Getting Started with Backstage](../../getting-started) for this repo, you
|
||||
should be able to browse the catalog at `http://localhost:3000`.
|
||||
[Getting Started with Backstage](../../getting-started), you should be able to
|
||||
browse the catalog at `http://localhost:3000`.
|
||||
|
||||

|
||||

|
||||
|
||||
## Adding components to the catalog
|
||||
|
||||
The source of truth for the components in your service catalog are
|
||||
The source of truth for the components in your software catalog are
|
||||
[metadata YAML files](descriptor-format.md) stored in source control (GitHub,
|
||||
GitHub Enterprise, GitLab, ...).
|
||||
|
||||
@@ -105,11 +104,11 @@ them, and do so using their normal Git workflow.
|
||||

|
||||
|
||||
Once the change has been merged, Backstage will automatically show the updated
|
||||
metadata in the service catalog after a short while.
|
||||
metadata in the software catalog after a short while.
|
||||
|
||||
## Finding software in the catalog
|
||||
|
||||
By default the service catalog shows components owned by the team of the logged
|
||||
By default the software catalog shows components owned by the team of the logged
|
||||
in user. But you can also switch to _All_ to see all the components across your
|
||||
company's software ecosystem. Basic inline _search_ and _column filtering_ makes
|
||||
it easy to browse a big set of components.
|
||||
@@ -125,7 +124,7 @@ _starring_ of components:
|
||||
|
||||
## Integrated tooling through plugins
|
||||
|
||||
The service catalog is a great way to organize the infrastructure tools you use
|
||||
The software catalog is a great way to organize the infrastructure tools you use
|
||||
to manage the software. This is how Backstage creates one developer portal for
|
||||
all your tools. Rather than asking teams to jump between different
|
||||
infrastructure UIs (and incurring additional cognitive overhead each time they
|
||||
|
||||
@@ -1,177 +0,0 @@
|
||||
---
|
||||
id: installation
|
||||
title: Installing in your Backstage App
|
||||
description: Documentation on How to install Backstage Plugin
|
||||
---
|
||||
|
||||
The catalog plugin comes in two packages, `@backstage/plugin-catalog` and
|
||||
`@backstage/plugin-catalog-backend`. Each has their own installation steps,
|
||||
outlined below.
|
||||
|
||||
## Installing @backstage/plugin-catalog
|
||||
|
||||
> **Note that if you used `npx @backstage/create-app`, the plugin is already
|
||||
> installed and you can skip to
|
||||
> [adding entries to the catalog](#adding-entries-to-the-catalog)**
|
||||
|
||||
The catalog frontend plugin should be installed in your `app` package, which is
|
||||
created as a part of `@backstage/create-app`. To install the package, run:
|
||||
|
||||
```bash
|
||||
# From your Backstage root directory
|
||||
cd packages/app
|
||||
yarn add @backstage/plugin-catalog
|
||||
```
|
||||
|
||||
### Adding the Plugin to your `packages/app`
|
||||
|
||||
Add the two pages that the catalog plugin provides to your app. You can choose
|
||||
any name for these routes, but we recommend the following:
|
||||
|
||||
```tsx
|
||||
// packages/app/src/App.tsx
|
||||
import {
|
||||
catalogPlugin,
|
||||
CatalogIndexPage,
|
||||
CatalogEntityPage,
|
||||
} from '@backstage/plugin-catalog';
|
||||
|
||||
// Add to the top-level routes, directly within <FlatRoutes>
|
||||
<Route path="/catalog" element={<CatalogIndexPage />} />
|
||||
<Route path="/catalog/:namespace/:kind/:name" element={<CatalogEntityPage />}>
|
||||
{/*
|
||||
This is the root of the custom entity pages for your app, refer to the example app
|
||||
in the main repo or the output of @backstage/create-app for an example
|
||||
*/}
|
||||
<EntityPage />
|
||||
</Route>
|
||||
```
|
||||
|
||||
The catalog plugin also has one external route that needs to be bound for it to
|
||||
function: the `createComponent` route which should link to the page where the
|
||||
user can create components. In a typical setup the create component route will
|
||||
be linked to the Scaffolder plugin's template index page:
|
||||
|
||||
```ts
|
||||
// packages/app/src/App.tsx
|
||||
import { catalogPlugin } from '@backstage/plugin-catalog';
|
||||
import { scaffolderPlugin } from '@backstage/plugin-scaffolder';
|
||||
|
||||
const app = createApp({
|
||||
// ...
|
||||
bindRoutes({ bind }) {
|
||||
bind(catalogPlugin.externalRoutes, {
|
||||
createComponent: scaffolderPlugin.routes.root,
|
||||
});
|
||||
},
|
||||
});
|
||||
```
|
||||
|
||||
You may also want to add a link to the catalog index page to your sidebar:
|
||||
|
||||
```tsx
|
||||
// packages/app/src/components/Root.tsx
|
||||
import HomeIcon from '@material-ui/icons/Home';
|
||||
|
||||
// Somewhere within the <Sidebar>
|
||||
<SidebarItem icon={HomeIcon} to="/catalog" text="Home" />;
|
||||
```
|
||||
|
||||
This is all that is needed for the frontend part of the Catalog plugin to work!
|
||||
|
||||
## Gotchas that we will fix
|
||||
|
||||
Since the catalog plugin currently ships with a sentry plugin `InfoCard`
|
||||
installed by default, you'll need to set `sentry.organization` in your
|
||||
`app-config.yaml`. For example:
|
||||
|
||||
```yaml
|
||||
sentry:
|
||||
organization: Acme Corporation
|
||||
```
|
||||
|
||||
If you've created an app with an older version of `@backstage/create-app` or
|
||||
`@backstage/cli create-app`, be sure to remove the Welcome plugin from the app,
|
||||
as that will conflict with the catalog routes.
|
||||
|
||||
## Installing @backstage/plugin-catalog-backend
|
||||
|
||||
> **Note that if you used `npx @backstage/create-app`, the plugin is already
|
||||
> installed and you can skip to
|
||||
> [adding entries to the catalog](#adding-entries-to-the-catalog)**
|
||||
|
||||
The catalog backend should be installed in your `backend` package, which is
|
||||
created as a part of `@backstage/create-app`. To install the package, run:
|
||||
|
||||
```bash
|
||||
# From your Backstage root directory
|
||||
cd packages/backend
|
||||
yarn add @backstage/plugin-catalog-backend
|
||||
```
|
||||
|
||||
### Adding the Plugin to your `packages/backend`
|
||||
|
||||
You'll need to add the plugin to the `backend`'s router. You can do this by
|
||||
creating a file called `packages/backend/src/plugins/catalog.ts` with contents
|
||||
matching
|
||||
[catalog.ts in the create-app template](https://github.com/backstage/backstage/blob/master/packages/create-app/templates/default-app/packages/backend/src/plugins/catalog.ts).
|
||||
|
||||
Once the `catalog.ts` router setup file is in place, add the router to
|
||||
`packages/backend/src/index.ts`:
|
||||
|
||||
```ts
|
||||
import catalog from './plugins/catalog';
|
||||
|
||||
const catalogEnv = useHotMemoize(module, () => createEnv('catalog'));
|
||||
|
||||
const apiRouter = Router();
|
||||
/** several different routers */
|
||||
apiRouter.use('/catalog', await catalog(catalogEnv));
|
||||
```
|
||||
|
||||
### Adding Entries to the Catalog
|
||||
|
||||
At this point the catalog backend is installed in your backend package, but you
|
||||
will not have any entities loaded.
|
||||
|
||||
To get up and running and try out some templates quickly, you can add some of
|
||||
our example templates through static configuration. Add the following to the
|
||||
`catalog.locations` section in your `app-config.yaml`:
|
||||
|
||||
```yaml
|
||||
catalog:
|
||||
locations:
|
||||
# Backstage Example Components
|
||||
- type: url
|
||||
target: https://github.com/backstage/backstage/blob/master/packages/catalog-model/examples/components/artist-lookup-component.yaml
|
||||
- type: url
|
||||
target: https://github.com/backstage/backstage/blob/master/packages/catalog-model/examples/components/playback-order-component.yaml
|
||||
- type: url
|
||||
target: https://github.com/backstage/backstage/blob/master/packages/catalog-model/examples/components/podcast-api-component.yaml
|
||||
- type: url
|
||||
target: https://github.com/backstage/backstage/blob/master/packages/catalog-model/examples/components/queue-proxy-component.yaml
|
||||
- type: url
|
||||
target: https://github.com/backstage/backstage/blob/master/packages/catalog-model/examples/components/searcher-component.yaml
|
||||
- type: url
|
||||
target: https://github.com/backstage/backstage/blob/master/packages/catalog-model/examples/components/playback-lib-component.yaml
|
||||
- type: url
|
||||
target: https://github.com/backstage/backstage/blob/master/packages/catalog-model/examples/components/www-artist-component.yaml
|
||||
- type: url
|
||||
target: https://github.com/backstage/backstage/blob/master/packages/catalog-model/examples/components/shuffle-api-component.yaml
|
||||
```
|
||||
|
||||
### Running the Backend
|
||||
|
||||
Finally, start up Backstage with the new configuration:
|
||||
|
||||
```bash
|
||||
# Run from the root to start both backend and frontend
|
||||
yarn dev
|
||||
|
||||
# Alternatively, run only the backend from its own package
|
||||
cd packages/backend
|
||||
yarn start
|
||||
```
|
||||
|
||||
If you've also set up the frontend plugin, you should be ready to go browse the
|
||||
catalog at [localhost:3000](http://localhost:3000) now!
|
||||
@@ -83,7 +83,7 @@ spec:
|
||||
[Template Entity](../software-catalog/descriptor-format.md#kind-template)
|
||||
contains more information about the required fields.
|
||||
|
||||
Once we have a `template.yaml` ready, we can then add it to the service catalog
|
||||
Once we have a `template.yaml` ready, we can then add it to the software catalog
|
||||
for use by the scaffolder.
|
||||
|
||||
You can add the template files to the catalog through
|
||||
|
||||
@@ -0,0 +1,52 @@
|
||||
---
|
||||
id: configuration
|
||||
title: Software Template Configuration
|
||||
sidebar_label: Configuration
|
||||
description: Configuration options for Backstage Software Templates
|
||||
---
|
||||
|
||||
Backstage software templates create source code, so your Backstage application
|
||||
needs to be set up to allow repository creation.
|
||||
|
||||
This is done in your `app-config.yaml` by adding
|
||||
[Backstage integrations](https://backstage.io/docs/integrations/) for the
|
||||
appropriate source code repository for your organization.
|
||||
|
||||
> Note: Integrations may already be set up as part of your `app-config.yaml`.
|
||||
|
||||
The next step is to add
|
||||
[add templates](http://backstage.io/docs/features/software-templates/adding-templates)
|
||||
to your Backstage app.
|
||||
|
||||
### GitHub
|
||||
|
||||
For GitHub, you can configure who can see the new repositories that are created
|
||||
by specifying `visibility` option. Valid options are `public`, `private` and
|
||||
`internal`. The `internal` option is for GitHub Enterprise clients, which means
|
||||
public within the enterprise.
|
||||
|
||||
```yaml
|
||||
scaffolder:
|
||||
github:
|
||||
visibility: public # or 'internal' or 'private'
|
||||
```
|
||||
|
||||
### Disabling Docker in Docker situation (Optional)
|
||||
|
||||
Software Templates use
|
||||
[Cookiecutter](https://github.com/cookiecutter/cookiecutter) as a templating
|
||||
library. By default it will use the
|
||||
[scaffolder-backend/Cookiecutter](https://github.com/backstage/backstage/blob/master/plugins/scaffolder-backend/scripts/Cookiecutter.dockerfile)
|
||||
docker image.
|
||||
|
||||
If you are running Backstage from a Docker container and you want to avoid
|
||||
calling a container inside a container, you can set up Cookiecutter in your own
|
||||
image, this will use the local installation instead.
|
||||
|
||||
You can do so by including the following lines in the last step of your
|
||||
`Dockerfile`:
|
||||
|
||||
```Dockerfile
|
||||
RUN apt-get update && apt-get install -y python3 python3-pip
|
||||
RUN pip3 install cookiecutter
|
||||
```
|
||||
@@ -17,10 +17,8 @@ locations like GitHub or GitLab.
|
||||
|
||||
### Getting Started
|
||||
|
||||
> Be sure to have covered [Installing in your Backstage App](./installation.md)
|
||||
> for your separate App or
|
||||
> [Getting Started with Backstage](../../getting-started) for this repo before
|
||||
> proceeding.
|
||||
> Be sure to have covered
|
||||
> [Getting Started with Backstage](../../getting-started) before proceeding.
|
||||
|
||||
The Software Templates are available under `/create`. For local development you
|
||||
should be able to reach them at `http://localhost:3000/create`.
|
||||
|
||||
@@ -1,280 +0,0 @@
|
||||
---
|
||||
id: installation
|
||||
title: Installing in your Backstage App
|
||||
description: Documentation on How to install Backstage App
|
||||
---
|
||||
|
||||
The scaffolder plugin comes in two packages, `@backstage/plugin-scaffolder` and
|
||||
`@backstage/plugin-scaffolder-backend`. Each has their own installation steps,
|
||||
outlined below.
|
||||
|
||||
The Scaffolder plugin also depends on the Software Catalog. Instructions for how
|
||||
to set that up can be found [here](../software-catalog/installation.md).
|
||||
|
||||
## Installing @backstage/plugin-scaffolder
|
||||
|
||||
> **Note that if you used `npx @backstage/create-app`, the plugin may already be
|
||||
> present**
|
||||
|
||||
The scaffolder frontend plugin should be installed in your `app` package, which
|
||||
is created as a part of `@backstage/create-app`. To install the package, run:
|
||||
|
||||
```bash
|
||||
# From your Backstage root directory
|
||||
cd packages/app
|
||||
yarn add @backstage/plugin-scaffolder
|
||||
```
|
||||
|
||||
### Adding the Plugin to your `packages/app`
|
||||
|
||||
Add the root page that the Scaffolder plugin provides to your app. You can
|
||||
choose any path for the route, but we recommend the following:
|
||||
|
||||
```tsx
|
||||
import { ScaffolderPage } from '@backstage/plugin-scaffolder';
|
||||
|
||||
// Add to the top-level routes, directly within <FlatRoutes>
|
||||
<Route path="/create" element={<ScaffolderPage />} />;
|
||||
```
|
||||
|
||||
You may also want to add a link to the template index page to your sidebar:
|
||||
|
||||
```tsx
|
||||
import CreateComponentIcon from '@material-ui/icons/AddCircleOutline';
|
||||
|
||||
// Somewhere within the <Sidebar>
|
||||
<SidebarItem icon={CreateComponentIcon} to="create" text="Create..." />;
|
||||
```
|
||||
|
||||
This is all that is needed for the frontend part of the Scaffolder plugin to
|
||||
work!
|
||||
|
||||
## Installing @backstage/plugin-scaffolder-backend
|
||||
|
||||
> **Note that if you used `npx @backstage/create-app`, the plugin may already be
|
||||
> present**
|
||||
|
||||
The scaffolder backend should be installed in your `backend` package, which is
|
||||
created as a part of `@backstage/create-app`. To install the package, run:
|
||||
|
||||
```bash
|
||||
# From your Backstage root directory
|
||||
cd packages/backend
|
||||
yarn add @backstage/plugin-scaffolder-backend
|
||||
```
|
||||
|
||||
### Adding the Plugin to your `packages/backend`
|
||||
|
||||
You'll need to add the plugin to the `backend`'s router. You can do this by
|
||||
creating a file called `packages/backend/src/plugins/scaffolder.ts` with the
|
||||
following contents to get you up and running quickly.
|
||||
|
||||
```ts
|
||||
import {
|
||||
DockerContainerRunner,
|
||||
SingleHostDiscovery,
|
||||
} from '@backstage/backend-common';
|
||||
import {
|
||||
CookieCutter,
|
||||
createRouter,
|
||||
Preparers,
|
||||
Publishers,
|
||||
CreateReactAppTemplater,
|
||||
Templaters,
|
||||
} from '@backstage/plugin-scaffolder-backend';
|
||||
import type { PluginEnvironment } from '../types';
|
||||
import Docker from 'dockerode';
|
||||
import { CatalogClient } from '@backstage/catalog-client';
|
||||
|
||||
export default async function createPlugin({
|
||||
logger,
|
||||
config,
|
||||
database,
|
||||
reader,
|
||||
}: PluginEnvironment) {
|
||||
const dockerClient = new Docker();
|
||||
const containerRunner = new DockerContainerRunner({ dockerClient });
|
||||
|
||||
const cookiecutterTemplater = new CookieCutter({ containerRunner });
|
||||
const craTemplater = new CreateReactAppTemplater({ containerRunner });
|
||||
const templaters = new Templaters();
|
||||
|
||||
templaters.register('cookiecutter', cookiecutterTemplater);
|
||||
templaters.register('cra', craTemplater);
|
||||
|
||||
const preparers = await Preparers.fromConfig(config, { logger });
|
||||
const publishers = await Publishers.fromConfig(config, { logger });
|
||||
|
||||
const discovery = SingleHostDiscovery.fromConfig(config);
|
||||
const catalogClient = new CatalogClient({ discoveryApi: discovery });
|
||||
|
||||
return await createRouter({
|
||||
preparers,
|
||||
templaters,
|
||||
publishers,
|
||||
logger,
|
||||
config,
|
||||
database,
|
||||
catalogClient,
|
||||
reader,
|
||||
});
|
||||
}
|
||||
```
|
||||
|
||||
Once the `scaffolder.ts` router setup file is in place, add the router to
|
||||
`packages/backend/src/index.ts`:
|
||||
|
||||
```ts
|
||||
import scaffolder from './plugins/scaffolder';
|
||||
|
||||
const scaffolderEnv = useHotMemoize(module, () => createEnv('scaffolder'));
|
||||
|
||||
const apiRouter = Router();
|
||||
/* several router .use calls */
|
||||
|
||||
/* add this line */
|
||||
apiRouter.use('/scaffolder', await scaffolder(scaffolderEnv));
|
||||
```
|
||||
|
||||
### Adding Templates
|
||||
|
||||
At this point the scaffolder backend is installed in your backend package, but
|
||||
you will not have any templates available to use. These need to be added to the
|
||||
software catalog, as they are represented as entities of kind
|
||||
[Template](../software-catalog/descriptor-format.md#kind-template). You can find
|
||||
out more about adding templates [here](./adding-templates.md).
|
||||
|
||||
To get up and running and try out some templates quickly, you can add some of
|
||||
our example templates through static configuration. Add the following to the
|
||||
`catalog.locations` section in your `app-config.yaml`:
|
||||
|
||||
```yaml
|
||||
catalog:
|
||||
locations:
|
||||
# Backstage Example Templates
|
||||
- type: url
|
||||
target: https://github.com/backstage/backstage/blob/master/plugins/scaffolder-backend/sample-templates/react-ssr-template/template.yaml
|
||||
- type: url
|
||||
target: https://github.com/backstage/backstage/blob/master/plugins/scaffolder-backend/sample-templates/springboot-grpc-template/template.yaml
|
||||
- type: url
|
||||
target: https://github.com/backstage/backstage/blob/master/plugins/scaffolder-backend/sample-templates/create-react-app/template.yaml
|
||||
- type: url
|
||||
target: https://github.com/spotify/cookiecutter-golang/blob/master/template.yaml
|
||||
```
|
||||
|
||||
### Runtime Dependencies / Configuration
|
||||
|
||||
For the scaffolder backend plugin to function, you'll need to setup the
|
||||
integrations config in your `app-config.yaml`.
|
||||
|
||||
You can find help for different providers below.
|
||||
|
||||
> Note: Some of this configuration may already be set up as part of your
|
||||
> `app-config.yaml`. We're moving away from the duplicated config for
|
||||
> authentication in the `scaffolder` section and using `integrations` instead.
|
||||
|
||||
#### GitHub
|
||||
|
||||
The GitHub access token is retrieved from environment variables via the config.
|
||||
The config file needs to specify what environment variable the token is
|
||||
retrieved from. Your config should have the following objects.
|
||||
|
||||
You can configure who can see the new repositories that the scaffolder creates
|
||||
by specifying `visibility` option. Valid options are `public`, `private` and
|
||||
`internal`. The `internal` option is for GitHub Enterprise clients, which means
|
||||
public within the enterprise.
|
||||
|
||||
```yaml
|
||||
integrations:
|
||||
github:
|
||||
- host: github.com
|
||||
token: ${GITHUB_TOKEN}
|
||||
|
||||
scaffolder:
|
||||
github:
|
||||
visibility: public # or 'internal' or 'private'
|
||||
```
|
||||
|
||||
#### GitLab
|
||||
|
||||
For GitLab, we currently support the configuration of the GitLab publisher and
|
||||
allows to configure the private access token and the base URL of a GitLab
|
||||
instance:
|
||||
|
||||
```yaml
|
||||
integrations:
|
||||
gitlab:
|
||||
- host: gitlab.com
|
||||
token: ${GITLAB_TOKEN}
|
||||
```
|
||||
|
||||
#### Bitbucket
|
||||
|
||||
For Bitbucket there are two authentication methods supported. Either `token` or
|
||||
a combination of `appPassword` and `username`. It looks like either of the
|
||||
following:
|
||||
|
||||
```yaml
|
||||
integrations:
|
||||
bitbucket:
|
||||
- host: bitbucket.org
|
||||
token: ${BITBUCKET_TOKEN}
|
||||
```
|
||||
|
||||
or
|
||||
|
||||
```yaml
|
||||
integrations:
|
||||
bitbucket:
|
||||
- host: bitbucket.org
|
||||
appPassword: ${BITBUCKET_APP_PASSWORD}
|
||||
username: ${BITBUCKET_USERNAME}
|
||||
```
|
||||
|
||||
#### Azure DevOps
|
||||
|
||||
For Azure DevOps we support both the preparer and publisher stage with the
|
||||
configuration of a private access token (PAT). For the publisher it's also
|
||||
required to define the base URL for the client to connect to the service. This
|
||||
will hopefully support on-prem installations as well but that has not been
|
||||
verified.
|
||||
|
||||
```yaml
|
||||
integrations:
|
||||
azure:
|
||||
- host: dev.azure.com
|
||||
token: ${AZURE_TOKEN}
|
||||
```
|
||||
|
||||
### Running the Backend
|
||||
|
||||
Finally, make sure you have a local Docker daemon running, and start up the
|
||||
backend with the new configuration:
|
||||
|
||||
```bash
|
||||
cd packages/backend
|
||||
GITHUB_TOKEN=<token> yarn start
|
||||
```
|
||||
|
||||
If you've also set up the frontend plugin, so you should be ready to go browse
|
||||
the templates at [localhost:3000/create](http://localhost:3000/create) now!
|
||||
|
||||
### Disabling Docker in Docker situation (Optional)
|
||||
|
||||
Software Templates use
|
||||
[Cookiecutter](https://github.com/cookiecutter/cookiecutter) as templating
|
||||
library. By default it will use the
|
||||
[spotify/backstage-cookiecutter](https://github.com/backstage/backstage/blob/37e35b910afc7d1270855aed0ec4718aba366c91/plugins/scaffolder-backend/scripts/Cookiecutter.dockerfile)
|
||||
docker image.
|
||||
|
||||
If you are running Backstage from a Docker container and you want to avoid
|
||||
calling a container inside a container, you can set up Cookiecutter in your own
|
||||
image, this will use the local installation instead.
|
||||
|
||||
You can do so by including the following lines in the last step of your
|
||||
`Dockerfile`:
|
||||
|
||||
```Dockerfile
|
||||
RUN apt-get update && apt-get install -y python3 python3-pip
|
||||
RUN pip3 install cookiecutter
|
||||
```
|
||||
@@ -4,8 +4,8 @@ title: Writing Templates
|
||||
description: Details around creating your own custom Software Templates
|
||||
---
|
||||
|
||||
Templates are stored in the **Service Catalog** under a kind `Template`. You can
|
||||
create your own templates with a small `yaml` definition which describes the
|
||||
Templates are stored in the **Software Catalog** under a kind `Template`. You
|
||||
can create your own templates with a small `yaml` definition which describes the
|
||||
template and it's metadata, along with some input variables that your template
|
||||
will need, and then a list of actions which are then executed by the scaffolding
|
||||
service.
|
||||
|
||||
@@ -28,10 +28,10 @@ scratch.
|
||||
### Use the documentation template
|
||||
|
||||
Your working Backstage instance should by default have a documentation template
|
||||
added. If not, follow these
|
||||
[instructions](../software-templates/installation.md#adding-templates) to add
|
||||
the documentation template. The template creates a component with only TechDocs
|
||||
configuration and default markdown files as below mentioned in manual
|
||||
added. If not, copy the catalog locations from the
|
||||
[create-app template](https://github.com/backstage/backstage/blob/master/packages/create-app/templates/default-app/app-config.yaml.hbs)
|
||||
to add the documentation template. The template creates a component with only
|
||||
TechDocs configuration and default markdown files as below mentioned in manual
|
||||
documentation setup, and is otherwise empty.
|
||||
|
||||

|
||||
|
||||
@@ -370,7 +370,7 @@ techdocs:
|
||||
openStackSwift:
|
||||
containerName: 'name-of-techdocs-storage-bucket'
|
||||
credentials:
|
||||
userName: ${OPENSTACK_SWIFT_STORAGE_USERNAME}
|
||||
username: ${OPENSTACK_SWIFT_STORAGE_USERNAME}
|
||||
password: ${OPENSTACK_SWIFT_STORAGE_PASSWORD}
|
||||
authUrl: ${OPENSTACK_SWIFT_STORAGE_AUTH_URL}
|
||||
keystoneAuthVersion: ${OPENSTACK_SWIFT_STORAGE_AUTH_VERSION}
|
||||
|
||||
@@ -56,7 +56,7 @@ For example, adding the theme that we created in the previous section can be
|
||||
done like this:
|
||||
|
||||
```ts
|
||||
import { createApp } from '@backstage/core';
|
||||
import { createApp } from '@backstage/core-app-api';
|
||||
|
||||
const app = createApp({
|
||||
apis: ...,
|
||||
|
||||
@@ -94,7 +94,7 @@ here are some useful ones:
|
||||
```python
|
||||
yarn start # Start serving the example app, use --check to include type checks and linting
|
||||
|
||||
yarn storybook # Start local storybook, useful for working on components in @backstage/core
|
||||
yarn storybook # Start local storybook, useful for working on components in @backstage/core-components
|
||||
|
||||
yarn workspace @backstage/plugin-welcome start # Serve welcome plugin only, also supports --check
|
||||
|
||||
|
||||
@@ -137,7 +137,7 @@ frontend with `yarn start` in one window, and the backend with
|
||||
|
||||
It can often be useful to try out changes to the packages in the main Backstage
|
||||
repo within your own app. For example if you want to make modifications to
|
||||
`@backstage/core` and try them out in your app.
|
||||
`@backstage/core-plugin-api` and try them out in your app.
|
||||
|
||||
To link in external packages, add them to your `package.json` and `lerna.json`
|
||||
workspace paths. These can be either relative or absolute paths with or without
|
||||
@@ -147,7 +147,7 @@ globs. For example:
|
||||
"packages": [
|
||||
"packages/*",
|
||||
"plugins/*",
|
||||
"../backstage/packages/core", // New path added to work on @backstage/core
|
||||
"../backstage/packages/core-plugin-api", // New path added to work on @backstage/core-plugin-api
|
||||
],
|
||||
```
|
||||
|
||||
@@ -157,9 +157,10 @@ Then reinstall packages to make yarn set up symlinks:
|
||||
yarn install
|
||||
```
|
||||
|
||||
With this in place you can now modify the `@backstage/core` package within the
|
||||
main repo, and have those changes be reflected and tested in your app. Simply
|
||||
run your app using `yarn dev` (or `yarn start` for just frontend) as normal.
|
||||
With this in place you can now modify the `@backstage/core-plugin-api` package
|
||||
within the main repo, and have those changes be reflected and tested in your
|
||||
app. Simply run your app using `yarn dev` (or `yarn start` for just frontend) as
|
||||
normal.
|
||||
|
||||
Note that for backend packages you need to make sure that linked packages are
|
||||
not dependencies of any non-linked package. If you for example want to work on
|
||||
|
||||
@@ -127,18 +127,17 @@ are separated out into their own folder, see further down.
|
||||
used by the backend, we chose to separate `config` and `config-loader` into
|
||||
two different packages.
|
||||
|
||||
- [`core/`](https://github.com/backstage/backstage/tree/master/packages/core) -
|
||||
- [`core-app-api/`](https://github.com/backstage/backstage/tree/master/packages/core-app-api) -
|
||||
This package contains the core APIs that are used to wire together Backstage
|
||||
apps.
|
||||
|
||||
- [`core-components/`](https://github.com/backstage/backstage/tree/master/packages/core-components) -
|
||||
This package contains our visual React components, some of which you can find
|
||||
in
|
||||
[plugin examples](https://backstage.io/storybook/?path=/story/plugins-examples--plugin-with-data).
|
||||
Apart from that it re-exports everything from [`core-api`] so that users only
|
||||
need to rely on one package.
|
||||
|
||||
- [`core-api/`](https://github.com/backstage/backstage/tree/master/packages/core-api) -
|
||||
This package contains APIs and definitions of such. It is it's own package
|
||||
because we needed to split our `test-utils` package. It's an implementation
|
||||
detail that we try to hide from our users, and no one should have to depend on
|
||||
it directly.
|
||||
- [`core-plugin-api/`](https://github.com/backstage/backstage/tree/master/packages/core-plugin-api) -
|
||||
This package contains the core APIs that are used to build Backstage plugins.
|
||||
|
||||
- [`create-app/`](https://github.com/backstage/backstage/tree/master/packages/create-app) -
|
||||
An CLI to specifically scaffold a new Backstage App. It does so by using a
|
||||
@@ -6,8 +6,8 @@ sidebar_label: Locations
|
||||
description: Integrating source code stored in Azure DevOps into the Backstage catalog
|
||||
---
|
||||
|
||||
The Azure integration supports loading catalog entities from Azure DevOps.
|
||||
Entities can be added to
|
||||
The Azure DevOps integration supports loading catalog entities from Azure
|
||||
DevOps. Entities can be added to
|
||||
[static catalog configuration](../../features/software-catalog/configuration.md),
|
||||
or registered with the
|
||||
[catalog-import](https://github.com/backstage/backstage/tree/master/plugins/catalog-import)
|
||||
|
||||
@@ -0,0 +1,14 @@
|
||||
---
|
||||
id: org
|
||||
title: Microsoft Azure Active Directory Organizational Data
|
||||
sidebar_label: Org Data
|
||||
# prettier-ignore
|
||||
description: Importing users and groups from a Microsoft Azure Active Directory into Backstage
|
||||
---
|
||||
|
||||
The Backstage catalog can be set up to ingest organizational data - users and
|
||||
teams - directly from an tenant in Microsoft Azure Active Directory via the
|
||||
Microsoft Graph API.
|
||||
|
||||
More details on this are available in the
|
||||
[README of the `@backstage/plugin-catalog-backend-module-msgraph` package](https://github.com/backstage/backstage/blob/master/plugins/catalog-backend-module-msgraph/README.md).
|
||||
@@ -14,19 +14,25 @@ entities that mirror your org setup.
|
||||
|
||||
## Installation
|
||||
|
||||
The processor that performs the import, `LdapOrgReaderProcessor`, comes
|
||||
installed with the default setup of Backstage.
|
||||
1. The processor is not installed by default, therefore you have to add a
|
||||
dependency to `@backstage/plugin-catalog-backend-module-ldap` to your backend
|
||||
package.
|
||||
|
||||
If you replace the set of processors in your installation using that facility of
|
||||
the catalog builder class, you can import and add it as follows.
|
||||
```bash
|
||||
# From your Backstage root directory
|
||||
cd packages/backend
|
||||
yarn add @backstage/plugin-catalog-backend-module-ldap
|
||||
```
|
||||
|
||||
```ts
|
||||
// Typically in packages/backend/src/plugins/catalog.ts
|
||||
import { LdapOrgReaderProcessor } from '@backstage/plugin-catalog-backend';
|
||||
2. The `LdapOrgReaderProcessor` is not registered by default, so you have to
|
||||
register it in the catalog plugin:
|
||||
|
||||
builder.replaceProcessors(
|
||||
LdapOrgReaderProcessor.fromConfig(config, { logger }),
|
||||
// ...
|
||||
```typescript
|
||||
// packages/backend/src/plugins/catalog.ts
|
||||
builder.addProcessor(
|
||||
LdapOrgReaderProcessor.fromConfig(config, {
|
||||
logger,
|
||||
}),
|
||||
);
|
||||
```
|
||||
|
||||
|
||||
@@ -25,7 +25,7 @@ different ways.
|
||||
|
||||
The following diagram shows how Backstage might look when deployed inside a
|
||||
company which uses the Tech Radar plugin, the Lighthouse plugin, the CircleCI
|
||||
plugin and the service catalog.
|
||||
plugin and the software catalog.
|
||||
|
||||
There are 3 main components in this architecture:
|
||||
|
||||
@@ -142,7 +142,7 @@ Its architecture looks like this:
|
||||
|
||||

|
||||
|
||||
The service catalog in Backstage is another example of a service backed plugin.
|
||||
The software catalog in Backstage is another example of a service backed plugin.
|
||||
It retrieves a list of services, or "entities", from the Backstage Backend
|
||||
service and renders them in a table for the user.
|
||||
|
||||
|
||||
@@ -22,8 +22,8 @@ Our idea was to centralize and simplify end-to-end software development with an
|
||||
abstraction layer that sits on top of all of our infrastructure and developer
|
||||
tooling. That’s Backstage.
|
||||
|
||||
It’s a developer portal powered by a centralized service catalog — with a plugin
|
||||
architecture that makes it endlessly extensible and customizable.
|
||||
It’s a developer portal powered by a centralized software catalog — with a
|
||||
plugin architecture that makes it endlessly extensible and customizable.
|
||||
|
||||
Manage all your services, software, tooling, and testing in Backstage. Start
|
||||
building a new microservice using an automated template in Backstage. Create,
|
||||
|
||||
@@ -11,7 +11,7 @@ terminology below for clarity and consistency when discussing Backstage.
|
||||
|
||||
### Authentication Glossary
|
||||
|
||||
This [page](./auth/glossary.md) directs to the terms and phrases related to
|
||||
This [page](../auth/glossary.md) directs to the terms and phrases related to
|
||||
authentication and identity section of Backstage.
|
||||
|
||||
### Backstage User Profiles
|
||||
@@ -22,7 +22,7 @@ We have divided the project into three high-level _phases_:
|
||||
[UX patterns and components](https://backstage.io/storybook) help ensure a
|
||||
consistent experience between tools.
|
||||
|
||||
- 🐢 **Phase 2:** Service Catalog
|
||||
- 🐢 **Phase 2:** Software Catalog
|
||||
([alpha released](https://backstage.io/blog/2020/06/22/backstage-service-catalog-alpha)) -
|
||||
With a single catalog, Backstage makes it easy for a team to manage ten
|
||||
services — and makes it possible for your company to manage thousands of them.
|
||||
@@ -120,13 +120,13 @@ Chances are that someone will jump in and help build it.
|
||||
- [TechDocs v1](https://backstage.io/blog/2020/09/08/announcing-tech-docs)
|
||||
- [Plugin marketplace](https://backstage.io/plugins)
|
||||
- [Improved and move documentation to backstage.io](https://backstage.io/docs/overview/what-is-backstage)
|
||||
- [Backstage Service Catalog (alpha)](https://backstage.io/blog/2020/06/22/backstage-service-catalog-alpha)
|
||||
- [Backstage Software Catalog (alpha)](https://backstage.io/blog/2020/06/22/backstage-service-catalog-alpha)
|
||||
- [Backstage Software Templates (alpha)](https://backstage.io/blog/2020/08/05/announcing-backstage-software-templates)
|
||||
- [Make it possible to add custom auth providers](https://backstage.io/blog/2020/07/01/how-to-enable-authentication-in-backstage-using-passport)
|
||||
- [TechDocs v0](https://github.com/backstage/backstage/milestone/15)
|
||||
- CI plugins: CircleCI, Jenkins, GitHub Actions and TravisCI
|
||||
- [Service API documentation](https://github.com/backstage/backstage/pull/1737)
|
||||
- Backstage Service Catalog can read from: GitHub, GitLab,
|
||||
- Backstage Software Catalog can read from: GitHub, GitLab,
|
||||
[Bitbucket](https://github.com/backstage/backstage/pull/1938)
|
||||
- Support auth providers: Google, Okta, GitHub, GitLab,
|
||||
[auth0](https://github.com/backstage/backstage/pull/1611),
|
||||
|
||||
@@ -106,16 +106,6 @@ Used to load in static configuration, mainly for use by the CLI and
|
||||
|
||||
Stability: `1`. Mainly intended for internal use.
|
||||
|
||||
### `core` [GitHub](https://github.com/backstage/backstage/tree/master/packages/core/)
|
||||
|
||||
The `@backstage/core` and `@backstage/core-api` packages are being phased out
|
||||
and replaced by other `@backstage/core-*` packages. They are still in use but
|
||||
will not receive any breaking changes.
|
||||
|
||||
### `core-api` [GitHub](https://github.com/backstage/backstage/tree/master/packages/core-api/)
|
||||
|
||||
Stability: See `@backstage/core` above
|
||||
|
||||
### `core-app-api` [GitHub](https://github.com/backstage/backstage/tree/master/packages/core-app-api/)
|
||||
|
||||
The APIs used exclusively in the app, such as `createApp` and the system icons.
|
||||
@@ -194,8 +184,9 @@ Stability: `2`
|
||||
### `test-utils-core` [GitHub](https://github.com/backstage/backstage/tree/master/packages/test-utils-core/)
|
||||
|
||||
Internal testing utilities that are separated out for usage in
|
||||
@backstage/core-api. All exports are re-exported by @backstage/test-utils. This
|
||||
package should not be depended on directly.
|
||||
@backstage/core-app-api and @backstage/core-plugin-api. All exports are
|
||||
re-exported by @backstage/test-utils. This package should not be depended on
|
||||
directly.
|
||||
|
||||
Stability: See @backstage/test-utils
|
||||
|
||||
@@ -218,9 +209,6 @@ Stability: `1`
|
||||
|
||||
## Plugins
|
||||
|
||||
Plugins are rarely marked as stable as the `@backstage/core` plugin API is under
|
||||
heavy development.
|
||||
|
||||
Many backend plugins are split into "REST API" and "TypeScript Interface"
|
||||
sections. The "TypeScript Interface" refers to the API used to integrate the
|
||||
plugin into the backend.
|
||||
|
||||
@@ -2,13 +2,13 @@
|
||||
id: what-is-backstage
|
||||
title: What is Backstage?
|
||||
# prettier-ignore
|
||||
description: Backstage is an open platform for building developer portals. Powered by a centralized service catalog, Backstage restores order to your microservices and infrastructure
|
||||
description: Backstage is an open platform for building developer portals. Powered by a centralized software catalog, Backstage restores order to your microservices and infrastructure
|
||||
---
|
||||
|
||||

|
||||

|
||||
|
||||
[Backstage](https://backstage.io/) is an open platform for building developer
|
||||
portals. Powered by a centralized service catalog, Backstage restores order to
|
||||
portals. Powered by a centralized software catalog, Backstage restores order to
|
||||
your microservices and infrastructure and enables your product teams to ship
|
||||
high-quality code quickly — without compromising autonomy.
|
||||
|
||||
@@ -17,7 +17,7 @@ to create a streamlined development environment from end to end.
|
||||
|
||||
Out of the box, Backstage includes:
|
||||
|
||||
- [Backstage Service Catalog](../features/software-catalog/index.md) for
|
||||
- [Backstage Software Catalog](../features/software-catalog/index.md) for
|
||||
managing all your software (microservices, libraries, data pipelines,
|
||||
websites, ML models, etc.)
|
||||
|
||||
|
||||
@@ -99,7 +99,7 @@ import carmen from './plugins/carmen';
|
||||
async function main() {
|
||||
// ...
|
||||
const carmenEnv = useHotMemoize(module, () => createEnv('carmen'));
|
||||
apiRouter.use('/carmen', await carmen(badgesEnv));
|
||||
apiRouter.use('/carmen', await carmen(carmenEnv));
|
||||
```
|
||||
|
||||
After you start the backend (e.g. using `yarn start-backend` from the repo
|
||||
@@ -111,3 +111,42 @@ curl localhost:7000/api/carmen/health
|
||||
```
|
||||
|
||||
This should return `{"status":"ok"}` like before. Success!
|
||||
|
||||
## Making Use of a Database
|
||||
|
||||
The Backstage backend comes with a builtin facility for SQL database access.
|
||||
Most plugins that have persistence needs will choose to make use of this
|
||||
facility, so that Backstage operators can manage database needs uniformly.
|
||||
|
||||
As part of the environment object that is passed to your `createPlugin`
|
||||
function, there is a `database` field. You can use that to get a
|
||||
[Knex](http://knexjs.org/) connection object.
|
||||
|
||||
```ts
|
||||
// in packages/backend/src/plugins/carmen.ts
|
||||
export default async function createPlugin(env: PluginEnvironment) {
|
||||
const db: Knex<any, unknown[]> = await env.database.getClient();
|
||||
|
||||
// You will then pass this client into your actual plugin implementation
|
||||
// code, maybe similar to the following:
|
||||
const model = new CarmenDatabaseModel(db);
|
||||
return await createRouter({
|
||||
model: model,
|
||||
logger: env.logger,
|
||||
});
|
||||
}
|
||||
```
|
||||
|
||||
You may note that the `getClient` call has no parameters. This is because all
|
||||
plugin database needs are configured under the `backend.database` config key of
|
||||
your `app-config.yaml`. The framework may even make sure behind the scenes that
|
||||
the logical database is created automatically if it doesn't exist, based on
|
||||
rules that the Backstage operator decides on.
|
||||
|
||||
The framework does not handle database schema migrations for you, however. The
|
||||
builtin plugins in the main repo have chosen to use the Knex library to manage
|
||||
schema migrations as well, but you can do so in any manner that you see fit.
|
||||
|
||||
See the [Knex library documentation](http://knexjs.org/) for examples and
|
||||
details on how to write schema migrations and perform SQL queries against your
|
||||
database..
|
||||
|
||||
@@ -511,10 +511,11 @@ clarify intent. Refer to the following table to formulate the new name:
|
||||
## Porting Existing Apps
|
||||
|
||||
The first step of porting any app is to replace the root `Routes` component with
|
||||
`FlatRoutes` from `@backstage/core`. As opposed to the `Routes` component,
|
||||
`FlatRoutes` only considers the first level of `Route` components in its
|
||||
children, and provides any additional children to the outlet of the route. It
|
||||
also removes the need to append `"/*"` to paths, as it is added automatically.
|
||||
`FlatRoutes` from `@backstage/core-app-api`. As opposed to the `Routes`
|
||||
component, `FlatRoutes` only considers the first level of `Route` components in
|
||||
its children, and provides any additional children to the outlet of the route.
|
||||
It also removes the need to append `"/*"` to paths, as it is added
|
||||
automatically.
|
||||
|
||||
```diff
|
||||
const AppRoutes = () => (
|
||||
|
||||
@@ -22,9 +22,9 @@ yarn create-plugin
|
||||
This will create a new Backstage Plugin based on the ID that was provided. It
|
||||
will be built and added to the Backstage App automatically.
|
||||
|
||||
> If `yarn start` is already running you should be able to see the default page
|
||||
> for your new plugin directly by navigating to
|
||||
> `http://localhost:3000/my-plugin`.
|
||||
> If the Backstage App is already running (with `yarn start` or `yarn dev`) you
|
||||
> should be able to see the default page for your new plugin directly by
|
||||
> navigating to `http://localhost:3000/my-plugin`.
|
||||
|
||||

|
||||
|
||||
@@ -32,7 +32,7 @@ You can also serve the plugin in isolation by running `yarn start` in the plugin
|
||||
directory. Or by using the yarn workspace command, for example:
|
||||
|
||||
```bash
|
||||
yarn workspace @backstage/plugin-welcome start # Also supports --check
|
||||
yarn workspace @backstage/my-plugin start # Also supports --check
|
||||
```
|
||||
|
||||
This method of serving the plugin provides quicker iteration speed and a faster
|
||||
|
||||
@@ -43,6 +43,10 @@ root of the project which you can then use as an `include` in your
|
||||
`app-config.yaml`. You can go ahead and
|
||||
[skip ahead](#including-in-integrations-config) if you've already got an app.
|
||||
|
||||
Note that the created app will have a webhook that is disabled by default and
|
||||
points to `smee.io`, which is intended for local development. There's also
|
||||
currently no part of Backstage that makes use of the webhook.
|
||||
|
||||
### GitHub Enterprise
|
||||
|
||||
You have to create the GitHub Application manually using these
|
||||
@@ -84,3 +88,12 @@ integrations:
|
||||
apps:
|
||||
- $include: example-backstage-app-credentials.yaml
|
||||
```
|
||||
|
||||
### Permissions for pull requests
|
||||
|
||||
These are the minimum permissions required for creating a pull request with
|
||||
Backstage software templates:
|
||||
|
||||
- Read and Write permissions for `Contents`.
|
||||
- Read and write permissions for `Pull Requests` and `Issues`.
|
||||
- Read permissions on `Metadata`.
|
||||
|
||||
@@ -28,9 +28,9 @@ This helps the community know what plugins are in development.
|
||||
You can also use this process if you have an idea for a good plugin but you hope
|
||||
that someone else will pick up the work.
|
||||
|
||||
## Integrate into the Service Catalog
|
||||
## Integrate into the Software Catalog
|
||||
|
||||
If your plugin isn't supposed to live as a standalone page, but rather needs to
|
||||
be presented as a part of a Service Catalog (e.g. a separate tab or a card on an
|
||||
"Overview" tab), then check out
|
||||
[the instruction](integrating-plugin-into-service-catalog.md) on how to do it.
|
||||
be presented as a part of a Software Catalog (e.g. a separate tab or a card on
|
||||
an "Overview" tab), then check out
|
||||
[the instruction](integrating-plugin-into-software-catalog.md) on how to do it.
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
---
|
||||
id: integrating-plugin-into-service-catalog
|
||||
title: Integrate into the Service Catalog
|
||||
description: How to integrate a plugin into service catalog
|
||||
id: integrating-plugin-into-software-catalog
|
||||
title: Integrate into the Software Catalog
|
||||
description: How to integrate a plugin into software catalog
|
||||
---
|
||||
|
||||
> This is an advanced use case and currently is an experimental feature. Expect
|
||||
@@ -36,7 +36,7 @@ to avoid import cycles, for example like this:
|
||||
|
||||
```tsx
|
||||
/* src/routes.ts */
|
||||
import { createRouteRef } from '@backstage/core';
|
||||
import { createRouteRef } from '@backstage/core-plugin-api';
|
||||
|
||||
// Note: This route ref is for internal use only, don't export it from the plugin
|
||||
export const rootRouteRef = createRouteRef({
|
||||
@@ -46,11 +46,11 @@ export const rootRouteRef = createRouteRef({
|
||||
|
||||
Now that we have a `RouteRef`, we import it into `src/plugin.ts`, create our
|
||||
plugin instance with `createPlugin`, as well as create and wrap our routable
|
||||
extension using `createRoutableExtension` from `@backstage/core`:
|
||||
extension using `createRoutableExtension` from `@backstage/core-plugin-api`:
|
||||
|
||||
```tsx
|
||||
/* src/plugin.ts */
|
||||
import { createPlugin, createRouteRef } from '@backstage/core';
|
||||
import { createPlugin, createRouteRef } from '@backstage/core-plugin-api';
|
||||
import ExampleComponent from './components/ExampleComponent';
|
||||
|
||||
// Create a plugin instance and export this from your plugin package
|
||||
|
||||
@@ -57,7 +57,10 @@ package.json to declare the plugin dependencies, metadata and scripts.
|
||||
In the `src` folder we get to the interesting bits. Check out the `plugin.ts`:
|
||||
|
||||
```jsx
|
||||
import { createPlugin, createRoutableExtension } from '@backstage/core';
|
||||
import {
|
||||
createPlugin,
|
||||
createRoutableExtension,
|
||||
} from '@backstage/core-plugin-api';
|
||||
|
||||
import { rootRouteRef } from './routes';
|
||||
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
/*
|
||||
* Copyright 2020 Spotify AB
|
||||
* Copyright 2020 The Backstage Authors
|
||||
*
|
||||
* Licensed under the Apache License, Version 2.0 (the "License");
|
||||
* you may not use this file except in compliance with the License.
|
||||
|
||||
@@ -11,7 +11,7 @@ can use this to split out logic in your code for manual A/B testing, etc.
|
||||
Here's a code sample:
|
||||
|
||||
```typescript
|
||||
import { createPlugin } from '@backstage/core';
|
||||
import { createPlugin } from '@backstage/core-plugin-api';
|
||||
|
||||
export default createPlugin({
|
||||
id: 'plugin-name',
|
||||
@@ -29,7 +29,7 @@ To inspect the state of a feature flag inside your plugin, you can use the
|
||||
```tsx
|
||||
import React from 'react';
|
||||
import { Button } from '@material-ui/core';
|
||||
import { featureFlagsApiRef, useApi } from '@backstage/core';
|
||||
import { featureFlagsApiRef, useApi } from '@backstage/core-plugin-api';
|
||||
|
||||
const ExamplePage = () => {
|
||||
const featureFlags = useApi(featureFlagsApiRef);
|
||||
|
||||
@@ -30,7 +30,7 @@ type PluginHooks = {
|
||||
Showcasing adding a feature flag.
|
||||
|
||||
```jsx
|
||||
import { createPlugin } from '@backstage/core';
|
||||
import { createPlugin } from '@backstage/core-plugin-api';
|
||||
|
||||
export default createPlugin({
|
||||
id: 'new-plugin',
|
||||
|
||||
@@ -0,0 +1,204 @@
|
||||
---
|
||||
id: configuring-plugin-databases
|
||||
title: Configuring Plugin Databases
|
||||
# prettier-ignore
|
||||
description: Guide on how to configure Backstage databases.
|
||||
---
|
||||
|
||||
This guide covers a variety of production persistence use cases which are
|
||||
supported out of the box by Backstage. The database manager allows the developer
|
||||
to set the client and database connection details on a per plugin basis in
|
||||
addition to the base client and connection configuration. This means that you
|
||||
can use a SQLite 3 in-memory database for a specific plugin whilst using
|
||||
PostgreSQL for everything else and so on.
|
||||
|
||||
By default, Backstage uses automatically created databases for each plugin whose
|
||||
names follow the `backstage_plugin_<pluginId>` pattern, e.g.
|
||||
`backstage_plugin_auth`. You can configure a different database name prefix for
|
||||
use cases where you have multiple deployments running on a shared database
|
||||
instance or cluster.
|
||||
|
||||
With infrastructure defined as code or data (Terraform, AWS CloudFormation,
|
||||
etc.), you may have database credentials which lack permissions to create new
|
||||
databases or you do not have control over the database names. In these
|
||||
instances, you can set the database name and connection information on a per
|
||||
plugin basis as mentioned earlier.
|
||||
|
||||
Backstage supports all of these use cases with the `DatabaseManager` provided by
|
||||
`@backstage/backend-common`. We will now cover how to use and configure
|
||||
Backstage's databases.
|
||||
|
||||
## Prerequisites
|
||||
|
||||
### Dependencies
|
||||
|
||||
Please ensure the appropriate database drivers are installed in your `backend`
|
||||
package. If you intend to use both `postgres` and `sqlite3`, you can install
|
||||
both of them.
|
||||
|
||||
```sh
|
||||
cd packages/backend
|
||||
|
||||
# install pg if you need postgres
|
||||
yarn add pg
|
||||
|
||||
# install sqlite3 if you intend to set it as the client
|
||||
yarn add sqlite3
|
||||
```
|
||||
|
||||
From an operational perspective, you only need to install drivers for clients
|
||||
that are actively used.
|
||||
|
||||
### Database Manager
|
||||
|
||||
Existing Backstage instances should be updated to use `DatabaseManager` from
|
||||
`@backstage/backend-common` in your `packages/backend/src/index.ts` file, the
|
||||
`SingleConnectionDatabaseManager` has been deprecated. Import the manager and
|
||||
update the references as shown below if this is not the case:
|
||||
|
||||
```diff
|
||||
import {
|
||||
- SingleConnectionDatabaseManager,
|
||||
+ DatabaseManager,
|
||||
} from '@backstage/backend-common';
|
||||
|
||||
// ...
|
||||
|
||||
function makeCreateEnv(config: Config) {
|
||||
// ...
|
||||
- const databaseManager = SingleConnectionDatabaseManager.fromConfig(config);
|
||||
+ const databaseManager = DatabaseManager.fromConfig(config);
|
||||
// ...
|
||||
}
|
||||
```
|
||||
|
||||
## Configuration
|
||||
|
||||
You should set the base database client and connection information in your
|
||||
`app-config.yaml` (or equivalent) file. The base client and configuration is
|
||||
used as the default which is extended for each plugin with the same or unset
|
||||
client type. If a client type is specified for a specific plugin which does not
|
||||
match the base client, the configuration set for the plugin will be used as is
|
||||
without extending the base configuration.
|
||||
|
||||
Client type and configuration for plugins need to be defined under
|
||||
**`backend.database.plugin.<pluginId>`**. As an example, `catalog` is the
|
||||
`pluginId` for the catalog plugin and any configuration defined under that block
|
||||
is specific to that plugin. We will now explore more detailed example
|
||||
configurations below.
|
||||
|
||||
### Minimal In-Memory Configuration
|
||||
|
||||
In the example below, we are using `sqlite3` in-memory databases for all
|
||||
plugins. You may want to use this configuration for testing or other non-durable
|
||||
use cases.
|
||||
|
||||
```yaml
|
||||
backend:
|
||||
database:
|
||||
client: sqlite3
|
||||
connection: ':memory:'
|
||||
```
|
||||
|
||||
### PostgreSQL
|
||||
|
||||
The example below uses PostgreSQL (`pg`) as the database client for all plugins.
|
||||
The `auth` plugin uses a user defined database name instead of the automatically
|
||||
generated one which would have been `backstage_plugin_auth`.
|
||||
|
||||
```yaml
|
||||
backend:
|
||||
database:
|
||||
client: pg
|
||||
connection:
|
||||
host: some.example-pg-instance.tld
|
||||
user: postgres
|
||||
password: password
|
||||
port: 5432
|
||||
plugin:
|
||||
auth:
|
||||
connection:
|
||||
database: pg_auth_set_by_user
|
||||
```
|
||||
|
||||
### Custom Database Name Prefix
|
||||
|
||||
The configuration below uses `example_prefix_` as the database name prefix
|
||||
instead of `backstage_plugin_`. Plugins such as `auth` and `catalog` will use
|
||||
databases named `example_prefix_auth` and `example_prefix_catalog` respectively.
|
||||
|
||||
```yaml
|
||||
backend:
|
||||
database:
|
||||
client: pg
|
||||
connection:
|
||||
host: some.example-pg-instance.tld
|
||||
user: postgres
|
||||
password: password
|
||||
port: 5432
|
||||
prefix: 'example_prefix_'
|
||||
```
|
||||
|
||||
### Connection Configuration Per Plugin
|
||||
|
||||
Both `auth` and `catalog` use connection configuration with different
|
||||
credentials and database names. This type of configuration can be useful for
|
||||
environments with infrastructure as code or data which may provide randomly
|
||||
generated credentials and/or database names.
|
||||
|
||||
```yaml
|
||||
backend:
|
||||
database:
|
||||
client: pg
|
||||
connection: 'postgresql://some.example-pg-instance.tld:5432'
|
||||
plugin:
|
||||
auth:
|
||||
connection: 'postgresql://fort:knox@some.example-pg-instance.tld:5432/unwitting_fox_jumps'
|
||||
catalog:
|
||||
connection: 'postgresql://bank:reserve@some.example-pg-instance.tld:5432/shuffle_ransack_playback'
|
||||
```
|
||||
|
||||
### PostgreSQL and SQLite 3
|
||||
|
||||
The example below uses PostgreSQL (`pg`) as the database client for all plugins
|
||||
except the `auth` plugin which uses `sqlite3`. As the `auth` plugin's client
|
||||
type is different from the base client type, the connection configuration for
|
||||
`auth` is used verbatim without extending the base configuration for PostgreSQL.
|
||||
|
||||
```yaml
|
||||
backend:
|
||||
database:
|
||||
client: pg
|
||||
connection: 'postgresql://foo:bar@some.example-pg-instance.tld:5432'
|
||||
plugin:
|
||||
auth:
|
||||
client: sqlite3
|
||||
connection: ':memory:'
|
||||
```
|
||||
|
||||
## Check Your Databases
|
||||
|
||||
The `DatabaseManager` will attempt to create the databases if they do not exist.
|
||||
If you have set credentials per plugin because the credentials in the base
|
||||
configuration do not have permissions to create databases, you must ensure they
|
||||
exist before starting the service. The service will not be able to create them,
|
||||
it can only use them.
|
||||
|
||||
### Privileges
|
||||
|
||||
As Backstage attempts to check if the database exists, you may need to grant
|
||||
privileges to list or show databases for a given user. For PostgreSQL, you would
|
||||
grant the following:
|
||||
|
||||
```postgres
|
||||
GRANT SELECT ON pg_database TO some_user;
|
||||
```
|
||||
|
||||
MySQL:
|
||||
|
||||
```mysql
|
||||
GRANT SHOW DATABASES ON *.* TO some_user;
|
||||
```
|
||||
|
||||
The mechanisms in this guide should help you tackle different database
|
||||
deployment situations. Good luck!
|
||||
@@ -55,10 +55,10 @@ const spotifyAuthApiRef = createApiRef<OAuthApi>({
|
||||
Sam realizes that Spotify auth might be useful to others, and that it would be
|
||||
more convenient if it was a part of the Backstage Core. After submitting and
|
||||
merging a Pull Request with the additions to the
|
||||
`@backstage/plugin-auth-backend` and `@backstage/core` packages, Spotify auth is
|
||||
now available for everyone to use. Since the Backstage Core team also adds it to
|
||||
the public demo server, Sam can now get rid of it in the local setup and rely on
|
||||
the shared development auth providers instead.
|
||||
`@backstage/plugin-auth-backend` and `@backstage/core-plugin-api` packages,
|
||||
Spotify auth is now available for everyone to use. Since the Backstage Core team
|
||||
also adds it to the public demo server, Sam can now get rid of it in the local
|
||||
setup and rely on the shared development auth providers instead.
|
||||
|
||||
The only thing left now is making sure that users of the plugin provide Spotify
|
||||
auth in the app. Sam ensures this by adding `spotifyAuthApiRef` to the plugin's
|
||||
@@ -70,7 +70,7 @@ README.
|
||||
|
||||
This plugin requires the following APIs to function:
|
||||
|
||||
- `spotifyAuthApiRef` from `@backstage/core@^1.1.0`
|
||||
- `spotifyAuthApiRef` from `@@backstage/core-plugin-api@^1.1.0`
|
||||
```
|
||||
|
||||
# 3. The Catalog Awakens
|
||||
|
||||
@@ -0,0 +1,135 @@
|
||||
---
|
||||
id: migrating-away-from-core
|
||||
title: Migrating away from @backstage/core
|
||||
description: Guide on how to migrate to the new Backstage core libraries.
|
||||
---
|
||||
|
||||
The `@backstage/core` package has been split into three separate packages,
|
||||
`@backstage/core-app-api`, `@backstage/core-plugin-api`, and
|
||||
`@backstage/core-components`. For more information about the reasoning behind
|
||||
this change and the naming of the packages, see the
|
||||
[original RFC](https://github.com/backstage/backstage/issues/4872) and
|
||||
[initial PR](https://github.com/backstage/backstage/pull/5825).
|
||||
|
||||
The main purpose of the split is to make plugins more decoupled from the app,
|
||||
and open up for the possibility of combining plugins using many different
|
||||
versions of the core libraries. This should significantly reduce the maintenance
|
||||
burden on plugin authors, as well as reduce the impact of breaking changes in
|
||||
the core APIs.
|
||||
|
||||
## Migration
|
||||
|
||||
At a high level the migration is done by simply replacing usages of
|
||||
`@backstage/core` with one or more of the three new core libraries. There are a
|
||||
few breaking changes in the new packages that are listed below, but for most
|
||||
plugins the migration is a simple replacement. In order to make the migration as
|
||||
smooth as possible we provide a collection of tools to automate the majority of
|
||||
the migration effort.
|
||||
|
||||
Below is a list of steps that should get most projects completely migrated, the
|
||||
order of the steps is a recommendation but not required, so don't worry if you
|
||||
need to go back to previous steps to fix things.
|
||||
|
||||
### Step 1 - Run codemod
|
||||
|
||||
The first step is to run
|
||||
[`@backstage/codemods`](https://www.npmjs.com/package/@backstage/codemods)
|
||||
across your project. This will automatically convert all module imports in your
|
||||
source code to use one of the three new core packages instead. For example, the
|
||||
following change might occur:
|
||||
|
||||
```diff
|
||||
-import { useApi, configApiRef, InfoCard } from '@backstage/core';
|
||||
+import { useApi, configApiRef } from '@backstage/core-plugin-api';
|
||||
+import { InfoCard } from '@backstage/core-components';
|
||||
```
|
||||
|
||||
In a typical app created with `@backstage/create-app`, you would run the
|
||||
following:
|
||||
|
||||
```shell
|
||||
npx @backstage/codemods apply core-imports packages plugins
|
||||
```
|
||||
|
||||
The last two arguments, `packages` and `plugins`, are the folders that the
|
||||
codemod should be applied to. Add or remove folders as needed for your project.
|
||||
|
||||
The codemod might fail for some files because of the missing `IconKey` type in
|
||||
any of the new packages. This is one of the few breaking changes. To fix, remove
|
||||
any `IconKey` imports and replace usages of it with the `string` type, see the
|
||||
breaking changes section below for details. Once usages of `IconKey` type have
|
||||
been removed, you can re-run the codemod for those files.
|
||||
|
||||
Note that while the codemod tries to stick to using the existing formatting in
|
||||
your project, it doesn't always manage to do that. If you're using `prettier` to
|
||||
format the code in your project, it's best to run `prettier --write` on any
|
||||
files that were changed by the codemod.
|
||||
|
||||
### Step 2 - Update dependencies
|
||||
|
||||
The next step is to update dependencies in your `package.json` files. Any
|
||||
package that currently depends on `@backstage/core` will need to have it
|
||||
replaced by one or more of the new packages. The app package should have all
|
||||
three packages added to `dependencies`, while for plugins and additional non-app
|
||||
packages, the `@backstage/core-plugin-api` and `@backstage/core-components`
|
||||
packages should be added to the set of regular `dependencies`, and
|
||||
`@backstage/core-app-api` should be added to `devDependencies` for usage in
|
||||
tests.
|
||||
|
||||
A tool that can help out with step is the `plugin:diff` command from the
|
||||
`@backstage/cli`, it will compare your plugin to the base plugin template and
|
||||
suggest changes where the plugin deviates. A quick way to get this step done if
|
||||
you have up-to-date project is to run the following in the project root:
|
||||
|
||||
```bash
|
||||
# The --yes flag causes all suggested changes to be accepted automatically
|
||||
yarn diff --yes
|
||||
```
|
||||
|
||||
If you do not have the `diff` command set up in `package.json`, you can also
|
||||
manually execute the following in each plugin folder:
|
||||
|
||||
```bash
|
||||
yarn backstage-cli plugin:diff --yes
|
||||
```
|
||||
|
||||
### Step 3 - Manual review
|
||||
|
||||
At this point your app is either completely or very close to being migrated. Run
|
||||
type checks with `yarn tsc` to check if you hit any of the breaking changes
|
||||
below or if there are any other things to fix. It can also be worthwhile
|
||||
searching for occurrences of `@backstage/core` in the codebase, as that might
|
||||
find usages in for example `jest` mock calls, which aren't handled by the
|
||||
codemod.
|
||||
|
||||
As a final step you'll want to boot up the app and take it through any regular
|
||||
verification step that you have set up for your project. Don't hesitate to open
|
||||
a GitHub issue, PR, or reach out on Discord if you hit any snags, or if there
|
||||
are any additional steps or hints that you think should be added to this guide!
|
||||
|
||||
## Breaking Changes
|
||||
|
||||
The following is a list of breaking changes between `@backstage/core` and the
|
||||
three new core packages. Not that this list may not be exhaustive depending on
|
||||
when you migrate your app, as new releases of the new core packages may bring
|
||||
further changes.
|
||||
|
||||
### Removed `IconKey` type
|
||||
|
||||
The `IconKey` type used to be a string union of all known keys used for the app
|
||||
icons available through `useApp().getSystemIcon(key)`. The type has been removed
|
||||
since the set of allowed icon keys is no longer constrained, and there is
|
||||
instead only a guarantee that the app provides a minimum set of icons, but can
|
||||
provide any icons it wants beyond that. Migration is done by simply replacing
|
||||
old usages by the `string` type.
|
||||
|
||||
### Constrained `IconComponent` type
|
||||
|
||||
The `IconComponent` type used to allow all of the props from the MUI `SvgIcon`.
|
||||
This encouraged some bad patterns in open source plugins such as applying colors
|
||||
to the icons, which in turn hurt the ability to replace the icons with custom
|
||||
ones. The `IconComponent` type, which is now exported from
|
||||
`@backstage/core-plugin-api`, now only accepts a `fontSize` prop used to set the
|
||||
size of the icon. The type is compatible with the MUI `SvgIcon`, but there may
|
||||
be situations where an icon needs an explicit cast to `IconComponent` in order
|
||||
to narrow the type.
|
||||
@@ -72,7 +72,7 @@ Our first modification will be to extract information from the Identity API.
|
||||
|
||||
```tsx
|
||||
// Add identityApiRef to the list of imported from core
|
||||
import { identityApiRef, useApi } from '@backstage/core';
|
||||
import { identityApiRef, useApi } from '@backstage/core-plugin-api';
|
||||
```
|
||||
|
||||
3. Adjust the ExampleComponent from inline to block
|
||||
@@ -137,20 +137,13 @@ changes, let's start by wiping this component clean.
|
||||
import React from 'react';
|
||||
import { useAsync } from 'react-use';
|
||||
import Alert from '@material-ui/lab/Alert';
|
||||
import {
|
||||
Table,
|
||||
TableColumn,
|
||||
Progress,
|
||||
githubAuthApiRef,
|
||||
useApi,
|
||||
} from '@backstage/core';
|
||||
import { Table, TableColumn, Progress } from '@backstage/core-components';
|
||||
import { githubAuthApiRef, useApi } from '@backstage/core-plugin-api';
|
||||
import { graphql } from '@octokit/graphql';
|
||||
|
||||
const ExampleFetchComponent = () => {
|
||||
export const ExampleFetchComponent = () => {
|
||||
return <div>Nothing to see yet</div>;
|
||||
};
|
||||
|
||||
export default ExampleFetchComponent;
|
||||
```
|
||||
|
||||
3. Save that and ensure you see no errors. Comment out the unused imports if
|
||||
|
||||
@@ -0,0 +1,75 @@
|
||||
---
|
||||
title: How Spotify is helping more companies adopt Backstage
|
||||
author: Austin Lamon, Spotify
|
||||
authorURL: https://www.linkedin.com/in/austinlamon
|
||||
---
|
||||
|
||||
[](https://backstage.spotify.com/)
|
||||
_[backstage.spotify.com](https://backstage.spotify.com)_
|
||||
|
||||
The Backstage community is growing! In just over [a year](https://engineering.atspotify.com/2021/03/16/happy-birthday-backstage-spotifys-biggest-open-source-project-grows-up-fast/), Backstage has gone from a few open source building blocks to a thriving platform used by engineering orgs with thousands of developers. But even with 30+ [adopting companies](https://github.com/backstage/backstage/blob/master/ADOPTERS.md) and 400+ contributors, we are still in the very early stages of reaching the platform’s potential.
|
||||
|
||||
In order to grow Backstage further, Spotify is increasing the support we provide both adopters (the people integrating Backstage into their organizations) and contributors (the people building features and improving the code). The more companies that adopt Backstage, the more support the project gets, the stronger the platform becomes for everyone.
|
||||
|
||||
And while Spotify remains committed to maturing the Backstage platform — both as original creator and active maintainer — we also want to make room for the community to take greater ownership. Backstage may have started inside Spotify, but it belongs to all of you. So, we hope you join us in what’s next.
|
||||
|
||||
<!--truncate-->
|
||||
|
||||
## What’s next: More support for adopters and contributors
|
||||
|
||||
Alongside the code contributions, technical support, and community leadership provided by our dedicated (and still growing) Backstage team, Spotify is introducing three additional ways to help lower the barriers to adopting the platform:
|
||||
|
||||
1. **New consulting support.** In addition to investing in the Backstage getting started experience and the technical support we already provide, we’re adding [consulting support](https://backstage.spotify.com) for companies who are looking to adopt (or are already in the middle of adopting) Backstage.
|
||||
2. **Double the community sessions.** We are creating separate meetups for Backstage adopters and Backstage contributors for more focused discussions. (Come to both!)
|
||||
3. **Adding reviewers and maintainers.** We recently introduced [reviewers](https://github.com/backstage/backstage/pull/5137) to the Backstage project to speed up PR reviews and approvals, with the hope of also adding more maintainers in the future.
|
||||
|
||||
## Why Spotify is increasing its investment in open source (and why now)
|
||||
|
||||
Before we talk in more detail about these new efforts, why is Spotify doing this? The short answer is the same answer as when we released the very first open source version of Backstage: we envision Backstage as the standard developer portal platform across the industry.
|
||||
|
||||
### Setting the standard, both inside and outside Spotify
|
||||
|
||||
We believe in Backstage — we believe in the developer experience it provides, the developer-centric culture it encourages, and the immense value that the open source community brings to it. It is no exaggeration to say that we depend on Backstage every day at Spotify. It’s the central hub for our internal R&D community, and it’s both mission-critical to our daily operations and our future growth.
|
||||
|
||||
### We’re an adopter, too
|
||||
|
||||
We (that includes Spotify’s leadership, as well as our platform teams and dedicated Backstage team) also believe that Backstage’s continued success here — inside Spotify — depends on its success out here — in the wider open source community, where Backstage can reach its full potential. Like other adopters, we’re fully invested in the platform’s growth.
|
||||
|
||||
### An open platform is the strongest platform
|
||||
|
||||
We genuinely believe that the best platform for developers can only be shaped by the most diverse group of developers. Each new adopter and every new contributor brings unique perspectives and experiences to the challenges of improving developer experience and effectiveness. As the project scales — and progresses toward CNCF graduation — we need to make more room in the community for both adopters and contributors.
|
||||
|
||||
So, let’s get to it.
|
||||
|
||||
## Consulting support (and a new website) for adopters
|
||||
|
||||
[](https://backstage.spotify.com/)
|
||||
|
||||
We’ve launched a new website at: [backstage.spotify.com](https://backstage.spotify.com). It’s a hub for new and potential adopters to receive support from Spotify and our Preferred Partners. The site is focused on helping organizations get up and running with Backstage by addressing their unique needs and use cases.
|
||||
|
||||
You’ll find a high-level introduction to the platform, tips and tricks tested by Spotify to accelerate developer effectiveness, and access to a group of partners that have scaled Backstage for numerous adopters. You can also use the site to book product overviews, demos, and technical deep dives with members of the Spotify team.
|
||||
|
||||
We will continue to post important product announcements, technical documentation, feature demos, and community news here on Backstage.io. ([Subscribe to the newsletter](https://mailchi.mp/spotify/backstage-community) to stay up to date.) And both contributors and adopting companies can continue to find around-the-clock/around-the-world technical support on [GitHub](https://github.com/backstage/backstage) and [Discord](https://discord.gg/MUpMjP2).
|
||||
|
||||
## Separate community sessions for adopters and contributors
|
||||
|
||||
[](https://github.com/backstage/community/#backstage-community)
|
||||
|
||||
Earlier this year, we began hosting [Backstage Community Sessions](https://github.com/backstage/community/#backstage-community) — official meetups for anyone who wanted to join them. Since [the very first one](https://youtu.be/4-VX9tDdJYY), the Backstage team has been inspired and humbled by the community’s participation in these sessions — from hearing the [Expedia Group team share their journey adopting Backstage](https://youtu.be/rRphwXeq33Q?t=1509) to discussions about TypeScript and Material-UI. It’s great collaborating through code — but it’s also a lot of fun when you can see each other’s faces and have a conversation.
|
||||
|
||||
And while these sessions have been a success, the feedback we’ve gotten from the community has been very clear: more frequent and more focused conversations. So, later this summer, we’ll be launching standalone Backstage Adopter Sessions and Backstage Contributor Sessions. We hope this will lead to more useful sessions for everyone — and, of course, you are welcome to attend either or both:
|
||||
|
||||
- **For the adopter sessions:** we invite you to share the challenges, learnings, and use cases you’re facing with companies similar to yourselves.
|
||||
- **For the contributor sessions:** we invite you to share thoughts, suggestions, and gaps in the Backstage core with the maintainers and reviewers.
|
||||
|
||||
Speaking of reviewers and maintainers…
|
||||
|
||||
## Adding reviewers and maintainers
|
||||
|
||||
[](https://github.com/backstage/backstage/blob/master/GOVERNANCE.md#reviewers)
|
||||
|
||||
We have introduced [reviewers](https://github.com/backstage/backstage/blob/master/GOVERNANCE.md#reviewers) to the project! By adding this new role, we’ve expanded the number of people who are permitted to approve and merge pull requests. This will offload some of the review work from the maintainers, simplifying and speeding up the review process for contributors.
|
||||
|
||||
Of course, with these new efforts, we expect even more companies to adopt Backstage, which means the platform will continue to grow, and the number of PRs will continue to grow with it. As that happens, we hope to add to both the maintainer and reviewer teams in the future.
|
||||
|
||||
So, I’ll end this post as it began: the Backstage community is growing! And we look forward to growing even bigger, even faster, together.
|
||||
@@ -0,0 +1,101 @@
|
||||
---
|
||||
title: Announcing the Backstage Search platform: a customizable search tool built just for you
|
||||
author: Emma Indal, Spotify
|
||||
authorURL: https://www.linkedin.com/in/emma-indal
|
||||
---
|
||||
|
||||

|
||||
|
||||
**TLDR;** The new Backstage Search is now available in alpha, ready for you to start building on. A total rethinking of the core search feature in Backstage, it’s more than just a box you type into — it’s a mini platform all by itself. With its composable frontend and extensible backend, you can design and build the search tool that suits your organization’s needs.
|
||||
|
||||
So, you don’t just get an improved out-of-the-box experience for searching whatever is in your software catalog. You can also add support for searching other sources, too. Customize it the way you want and you can search your catalog, your plugins and docs — and even external sources, like Stack Overflow and Confluence — all at once, all right inside Backstage.
|
||||
|
||||
With one query, your teams can find exactly what they’re looking for: anything and everything.
|
||||
|
||||
<!--truncate-->
|
||||
|
||||
## Search and explore
|
||||
|
||||
Being able to easily explore your ecosystem — to discover software, tools, documentation, and other valuable knowledge — is one of [the three main jobs of Backstage](https://backstage.io/blog/2021/05/20/adopting-backstage#three-jobs-create-manage-explore). Teams should be able to find what other teams have already built, so they can reuse and contribute to components instead of unknowingly duplicating them. Data endpoints should be shared, not siloed away. Services and their APIs should be easily discoverable. Best practices and technical documentation should be easily found.
|
||||
|
||||
Along with the [Backstage Service Catalog](https://backstage.io/blog/2020/06/22/backstage-service-catalog-alpha), Backstage Search is essential to enabling this discoverability — allowing new hires and old hands alike to explore your infrastructure instead of getting lost inside it.
|
||||
|
||||
We also quickly realized that search looks different from organization to organization. Therefore, we built a search platform that lets you plug in your own search engine, index any information you like, or build a customized search page experience that fits your users’ needs.
|
||||
|
||||
Since finding what you are looking for in Backstage is critical for success, we started by identifying the needs and goals of search.
|
||||
|
||||
## Rethinking search, inside and out
|
||||
|
||||
Spotify’s internal version of Backstage has had some of the features of Backstage Search for a while, and open sourcing them has been top of mind since day one. But we didn’t want to just port our internal version to the open source version. We wanted to take the opportunity to apply what we’ve learned inside Spotify over the last year, address the needs we’ve observed in the community, and ultimately open source not just a search feature but a search platform. We started the process by looking at the [jobs to be done](https://hbr.org/2016/09/know-your-customers-jobs-to-be-done).
|
||||
|
||||

|
||||
_A high-level overview of the process, identifying all the jobs of search._
|
||||
|
||||
First, we looked at which jobs to be done belonged to the search plugin itself (e.g., “collect documents to index”) and which belonged to the other plugins (e.g., “format documents for indexing”), and then whether those jobs belonged to the frontend (“display results”) or the backend (“schedule indexing”).
|
||||
|
||||
Looking at all these various jobs, we defined four goals for the platform:
|
||||
|
||||
- **Flexibility:** Be search engine–agnostic
|
||||
- **Simplicity:** Make it easy for content owners to make their content searchable/discoverable
|
||||
- **Control:** Allow plugin developers to customize their search results components
|
||||
- **Reusability:** Offer reusable components/APIs that other devs can leverage
|
||||
|
||||
Beginning our journey this way — by identifying the jobs to be done first, then defining the product goals from there — we could make sure that the search platform addressed real needs and improved the search experience for both users and plugin developers.
|
||||
|
||||
This approach not only created a better search tool for the open source community, but for Spotify, as well. So, instead of just open sourcing our internal version of search, we ended up with an even better solution — one that we can all use and build on together, both inside and outside Spotify.
|
||||
|
||||
## Say hello to the Backstage Search platform
|
||||
|
||||

|
||||
|
||||
We are now happy and proud to announce our alpha version of the [Backstage Search Platform](https://backstage.io/docs/features/search/architecture), featuring:
|
||||
|
||||
- Bring your own search engine (Flexibility)
|
||||
- Collators for easily indexing content from plugins and other sources (Simplicity)
|
||||
- Composable search page experiences (Control, Reusability)
|
||||
- Customize the look and feel of each search result (Control, Reusability)
|
||||
|
||||
### Bring your own search engine
|
||||
|
||||
By introducing a Search Integration Layer, we have been able to keep the query translation of the search term and filters close to the search engine itself. This makes our search backend less focused on how a set of terms and filters should be translated to fit a certain search engine interface and more focused on querying and retrieving results as well as collecting results to index.
|
||||
|
||||
With the Search Integration Layer, your organization can bring your search engine of choice to Backstage — instead of relying on Backstage to support a specific search engine that might not fit the needs of your organization, either today or in the future.
|
||||
|
||||
But that doesn’t mean “batteries not included”. The current version of Backstage Search ships with Lunr support built-in — and support for ElasticSearch is not very far off. And we hope the number of supported search engines will continue to grow with the community’s help.
|
||||
|
||||
### Collators for easily indexing content from plugins and other sources
|
||||
|
||||
Since Backstage’s functionality comes from its plugins, we wanted the process of making plugin content searchable to be as frictionless as possible. Therefore we decided on a concept we call collators. Collators are responsible for collecting documents to index from a plugin. Your collators live inside your own plugin, but are registered in the Backstage app’s search backend.
|
||||
|
||||
Collators can also be used to index external sources, like Stack Overflow and Confluence. You can watch a demo of how easy it is to extend search with collators [here](https://youtu.be/Z78FFaObTfk?t=339).
|
||||
|
||||
### Composable search page experiences
|
||||
|
||||
Every engineering org has different needs — that is something we have definitely learned over the last year. Your software catalog might be set up differently than ours and therefore your needs for how search results look and how the search filters work will also differ.
|
||||
|
||||
That's why we have put effort into making your search page experience composable to your organization's needs. What do we mean by that? When you adopt Backstage and set up your app, you can set up — or, compose — your search page by using existing components or by creating your own custom ones.
|
||||
|
||||
### Customize the look and feel of each search result
|
||||
|
||||
A good example of the level of customization the platform allows is how list items are displayed in search results. A search result component can be a list, this list can consist of different list items (search results returned from the search engine) — but these list items could look different depending on what the search result returns in terms of its fields.
|
||||
|
||||
Let’s say that for an entity returned from the software catalog maybe the most important information to show is the name, while a result returned from the TechDocs plugin should maybe show the text content as the most important information. This can be customized by creating <CustomResultListItem /> components (like TechDocsResultListItem or CatalogResultListItem or whatever list item component you want) and configuring them in the app.
|
||||
|
||||
If there is no need to customize your search result list items, the <DefaultResultListItem /> component is there for you to reuse.
|
||||
|
||||
## Getting started with Backstage Search
|
||||
|
||||
We put together [a getting started guide](https://backstage.io/docs/features/search/getting-started) that provides two different ways to set up Backstage Search:
|
||||
|
||||
- Create a new app and get the most out of the search setup right out of the box, or
|
||||
- Add the new Backstage Search setup to your existing Backstage app.
|
||||
|
||||
Whichever situation you’re in, we have you covered.
|
||||
|
||||
## What’s next?
|
||||
|
||||
We’ve built the foundation for the Backstage Search platform, and we can't wait to see the exciting engines, collators, and components the community builds on the platform.
|
||||
|
||||
You can check out our [project roadmap](https://backstage.io/docs/features/search/search-overview#project-roadmap) in our search documentation or track the progress of our [Beta milestone](https://github.com/backstage/backstage/milestone/27) and [GA milestone](https://github.com/backstage/backstage/milestone/28).
|
||||
|
||||
For any questions, feedback or ideas about the Backstage Search platform, join us in the #search channel on [Discord](https://discord.gg/MUpMjP2)!
|
||||
|
After Width: | Height: | Size: 61 KiB |
|
After Width: | Height: | Size: 97 KiB |
|
After Width: | Height: | Size: 562 KiB |
|
After Width: | Height: | Size: 1.8 MiB |
|
After Width: | Height: | Size: 270 KiB |
|
After Width: | Height: | Size: 536 KiB |
|
After Width: | Height: | Size: 116 KiB |
@@ -33,7 +33,7 @@ class Footer extends React.Component {
|
||||
<a
|
||||
href={`/docs/features/software-catalog/software-catalog-overview`}
|
||||
>
|
||||
Service Catalog
|
||||
Software Catalog
|
||||
</a>
|
||||
<a href={`/docs/plugins/create-a-plugin`}>Create a Plugin</a>
|
||||
<a href={`/docs/dls/design`}>Designing for Backstage</a>
|
||||
|
||||