Brainscape's Knowledge GenomeTM


Top Flashcards (Certified)
All Flashcards

Backstage > Concepts > Flashcards

Concepts Flashcards

1
Q

Backstage 3 main projects

A

Core
Plugins
App

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
2
Q

What is core?

A

Base functionality built by core developers in the open source project

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
3
Q

The 3 main components of a simple backstage architecture

A

Core backstage UI
UI Plugins and their backing services
Database

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
4
Q

Architecture of the Backstage UI

A

thin, client-side wrapper around a set of plugins

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
5
Q

How does a plugin makes itself available in the UI?

A

Through a dedicate URL such as /lighthouse

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
6
Q

Where are plugin deployed?

A

backstage/plugins

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
7
Q

How are plugin installed?

A

As React components in your Backstage application

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
8
Q

What is CatalogIndexPage?

A

a plugin for full-page view to browse entities in the Backstage catalog

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
9
Q

Steps to install a plugin

A

1) Import it in the app
2) Add it as an element like this

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
10
Q

Code for installing a plugin

A

import { CatalogIndexPage } from ‘@backstage/plugin-catalog’;

…

const routes = (

<FlatRoutes>
...
<Route path="/catalog" element={<CatalogIndexPage></CatalogIndexPage>} />
...
</FlatRoutes>

);

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
11
Q

What are the 3 possible plugin architectures?

A

Standalone
Service backed
Third-party backed

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
12
Q

What is standalone plugin?

A

A plugin that run entirely in the browser

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
13
Q

Example of standalone plugin

A

Tech Radar plugin

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
14
Q

Explain service backed plugins

A

Plugins that make API requests to a service within the purview of the organisation running Backstage

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
15
Q

Example of service backed plugins

A

Lighthouse plugin
Software catalog

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
16
Q

Architecture of lighthouse-audit-service.

A

Microservice
Copy of Google’s Lighthouse library
Stores the results in a PostgreSQL database

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
17
Q

Explain software catalog plugin

A

Retrieves a list of services, or “entities”, from the Backstage Backend service and renders them for the user.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
18
Q

Explain third-party backed plugins

A

similar to service backed plugins
backing service is hosted outside of the ecosystem of the company

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
19
Q

Example of third-party backed plugins

A

CircleCI

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
20
Q

What is the difference between serviced backed plugins and third-party backed plugins

A

Third-party backed plugins need a proxy

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
21
Q

Why do third-party backed plugins need a proxy?

A

Requests going to the third-party backed plugin from the user’s browser are passed through the proxy service. Without this, the requests would be blocked by CORS

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
22
Q

What technology does Backstage use for packaging?

A

NPM

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
23
Q

What are the two ways Backstage uses NPM?

A

1) distribution of libraries
2) structuring of code within projects

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
24
Q

What are the classes of packages within Backstage?

A

1) Frontend packages
2) Common packages
3) Backend packages
4) Plugin packages
5) External plugin packages

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
25
What are the categories of frontend packages?
1) Frontend App Core 2) Frontend Plugin Core 3) Frontend Libraries
26
Characteristics of the common packages?
1) Very pervasive 2) Isomorphic 3) Use by frontend and backend
27
What is the cardinal rule about common packages?
never allowed to depend on any of the frontend or backend packages
28
What is the package that virtually all other packages depend on?
Backsstage CLI
29
Example of development dependency
Backstage CLI
30
What db library does Backstage use?
Knex library
31
Do plugins share the same database?
No, separate logical database per plugin
32
What databases have Backstage been tested with?
SQLite:test database PostgreSQL: production
33
How do you improve performance and reliability in Backstage?
Use caching
34
What library does Backstage use for caching?
Keyv
35
What caching technologies does Backstage support?
Memory, Memcache, Redis
36
Configuration for in-memory cache
backend: cache: store: memory
37
Configuration for memcache cache
backend: cache: store: memcache connection: user:pass@cache.com:11211
38
Configuration for redis cache
backend: cache: store: redis connection: redis://user:pwd@cache.com:6379 useRedisSets: true
39
What containers do you use to containerize Backstage?
The frontend container The backend container The Lighthouse audit service container
40
Command to install Backstage
npx @backstage/create-app@latest
41
Command to run backstage
cd my-backstage-app yarn dev
42
By default Backstage bings on locahost. How do you make it liste all all interfaces?
In app-config.yaml, chane listen to 0.0.0.0:3000
43
Backstage is install on server with IP: 192.168.50.100. How do you ensure you can invoke it using this IP?
in app-config.yaml, make following changes: app.baseUrl: http://192.168.50.100:3000 backend.baseUrl: http://192.168.50.100:7007 backend.cors.baseUrl: http://192.168.50.100:3000
44
After fresh instal of Backstage, what is its URL?
http://localhost:3000
45
How do you install the PostgreSQL client in backstage?
Go to the backstage root folder Run: yarn add --cwd packages/backend pg
46
How do you configure your backstage to use pg?
in app-config.yaml backend: database: client: pg connection: host: ${POSTGRES_HOST} port: ${POSTGRES_PORT} user: ${POSTGRES_USER} password: ${POSTGRES_PASSWORD}
47
How do you set the pg credentials?
1) define the env variables: POSTGRES_ 2) change app_config.yaml to hardcode them
48
To create an oauth app for backstage, what authorization URL should I use?
http://localhost:7007/api/auth/github/handler/frame
49
How do I configure GitHub Authentication?
1) Add github app credentials in app-config.yaml 2) change the sign-in page
50
How do you configure github app in app-config.yaml
auth: environment: development providers: github: development: clientId: YOUR CLIENT ID clientSecret: YOUR CLIENT SECRET
51
Add github sauth in sign-in page
In packages/app/src/App.tsx Add: import { githubAuthApiRef } from '@backstage/core-plugin-api'; import { SignInPage } from '@backstage/core-components'; Search for const app = createApp({ in this file, and below apis, add: components: { SignInPage: props => ( ), },
52
What is the goal of GitHub integration ?
load catalog entities from GitHub
53
What catalog entities can be loaded from GitHub?
1) static catalog configuration 2) catalog-import plugin data, 3) GitHub organization structures 4) Users and groups
54
How do you configure GitHub integration?
In app-config.local.yaml integrations: github: - host: github.com token: ${GITHUB_PAT}
55
Folder structure of an backstage app
app ├── app-config.yaml ├── catalog-info.yaml ├── lerna.json ├── package.json └── packages   ├── app    └── backend
56
What technology is used for setting up monorepo app?
learna
57
Command to add circleci plugin
yarn add --cwd packages/app @backstage/plugin-circleci
58
In following command, why do we do packages/app instead of packages/backend? yarn add --cwd packages/app @backstage/plugin-circleci
Because CircleCI is a frontend plugin and not a backend plugin
59
What are steps to instal the circleci plugin
1) Add circleci npm package to the repo 2) Add the EntityCircleCIContent extension to the entity pages 3) Add a proxy config
60
Configuration to add CirceCI proxy config
File: app-config.yaml proxy: '/circleci/api': target: https://circleci.com/api/v1.1 headers: Circle-Token: ${CIRCLECI_AUTH_TOKEN}
61
Add the EntityCircleCIContent extension to the entity pages
In packages/app/src/components/catalog/EntityPage.tsx import { EntityCircleCIContent, isCircleCIAvailable, } from '@backstage/plugin-circleci'; const cicdContent = ( {/* ... */} ;{/* highlight-add-end */} );
62
In which file is the sidebar is managed ?
packages/app/src/components/Root/Root.tsx
63
Instructions to install the api-docs plugin in the side bar
In packages/app/src/components/Root/Root.tsx import ExtensionIcon from '@material-ui/icons/Extension'; ;
64
Set your SVG as icon component
1) set the extension to icon.svg 2) In Root.tsx: import InternalToolIcon from './internal-tool.icon.svg';
65
What package are themes part of?
@backstage/theme

Backstage (3 decks)

Brainscape helps you reach your goals faster, through stronger study habits.
© 2025 Bold Learning Solutions. Terms and Conditions