diff --git a/docs/features/kubernetes/installation.md b/docs/features/kubernetes/installation.md index aca4c19ac1..ae06fa9acc 100644 --- a/docs/features/kubernetes/installation.md +++ b/docs/features/kubernetes/installation.md @@ -7,20 +7,17 @@ description: Installing Kubernetes plugin into Backstage The Kubernetes feature is a plugin to Backstage, and it is exposed as a tab when viewing entities in the software catalog. -If you haven't setup Backstage already, read the -[Getting Started](../../getting-started/index.md) guide. +If you haven't setup Backstage already, read the [Getting Started](../../getting-started/index.md) guide. ## Adding the Kubernetes frontend plugin -The first step is to add the Kubernetes frontend plugin to your Backstage -application. +The first step is to add the Kubernetes frontend plugin to your Backstage application. ```bash title="From your Backstage root directory" yarn --cwd packages/app add @backstage/plugin-kubernetes ``` -Once the package has been installed, you need to import the plugin in your app -by adding the "Kubernetes" tab to the respective catalog pages. +Once the package has been installed, you need to import the plugin in your app by adding the "Kubernetes" tab to the respective catalog pages. ```tsx title="packages/app/src/components/catalog/EntityPage.tsx" /* highlight-add-next-line */ @@ -40,73 +37,17 @@ const serviceEntityPage = ( ); ``` -**Notes:** +:::note Note -- The optional `refreshIntervalMs` property on the `EntityKubernetesContent` defines the interval in which the content automatically refreshes, if not set this will default to 10 seconds. +The optional `refreshIntervalMs` property on the `EntityKubernetesContent` defines the interval in which the content automatically refreshes, if not set this will default to 10 seconds. -That's it! But now, we need the Kubernetes Backend plugin for the frontend to -work. +::: + +That's it! But now, we need the Kubernetes Backend plugin for the frontend to work. ## Adding Kubernetes Backend plugin -Navigate to `packages/backend` of your Backstage app, and install the -`@backstage/plugin-kubernetes-backend` package. - -```bash title="From your Backstage root directory" -yarn --cwd packages/backend add @backstage/plugin-kubernetes-backend -``` - -Create a file called `kubernetes.ts` inside `packages/backend/src/plugins/` and -add the following: - -```ts title="packages/backend/src/plugins/kubernetes.ts" -import { KubernetesBuilder } from '@backstage/plugin-kubernetes-backend'; -import { Router } from 'express'; -import { PluginEnvironment } from '../types'; -import { CatalogClient } from '@backstage/catalog-client'; - -export default async function createPlugin( - env: PluginEnvironment, -): Promise { - const catalogApi = new CatalogClient({ discoveryApi: env.discovery }); - const { router } = await KubernetesBuilder.createBuilder({ - logger: env.logger, - config: env.config, - catalogApi, - discovery: env.discovery, - permissions: env.permissions, - }).build(); - return router; -} -``` - -And import the plugin to `packages/backend/src/index.ts`. There are three lines -of code you'll need to add, and they should be added near similar code in your -existing Backstage backend. - -```typescript title="packages/backend/src/index.ts" -// .. -/* highlight-add-next-line */ -import kubernetes from './plugins/kubernetes'; - -async function main() { - // ... - /* highlight-add-next-line */ - const kubernetesEnv = useHotMemoize(module, () => createEnv('kubernetes')); - // ... - /* highlight-add-next-line */ - apiRouter.use('/kubernetes', await kubernetes(kubernetesEnv)); -} -``` - -That's it! The Kubernetes frontend and backend have now been added to your -Backstage app. - -### New Backend System - -To get the Kubernetes plugin install using the New Backend System you will need to do the following: - -Run this command to add the package: +Firts we need to add the backend package: ```bash title="From your Backstage root directory" yarn --cwd packages/backend add @backstage/plugin-kubernetes-backend @@ -126,6 +67,9 @@ backend.add(import('@backstage/plugin-kubernetes-backend')); backend.start(); ``` +That's it! The Kubernetes frontend and backend have now been added to your +Backstage app. + ### Custom cluster discovery If either existing @@ -133,22 +77,18 @@ If either existing don't work for your use-case, it is possible to implement a custom [KubernetesClustersSupplier](https://backstage.io/docs/reference/plugin-kubernetes-backend.kubernetesclusterssupplier). -Change the following in `packages/backend/src/plugins/kubernetes.ts`: +Here's a very simplified example: -```ts title="packages/backend/src/plugins/kubernetes.ts" -import { - /* highlight-add-next-line */ - ClusterDetails, - KubernetesBuilder, - /* highlight-add-next-line */ - KubernetesClustersSupplier, -} from '@backstage/plugin-kubernetes-backend'; -import { Router } from 'express'; -import { PluginEnvironment } from '../types'; -/* highlight-add-next-line */ +```ts title="packages/backend/src/index.ts" +import { createBackend } from '@backstage/backend-defaults'; +import { createBackendModule } from '@backstage/backend-plugin-api'; import { Duration } from 'luxon'; +import { + ClusterDetails, + KubernetesClustersSupplier, + kubernetesClusterSupplierExtensionPoint, +} from '@backstage/plugin-kubernetes-node'; -/* highlight-add-start */ export class CustomClustersSupplier implements KubernetesClustersSupplier { constructor(private clusterDetails: ClusterDetails[] = []) {} @@ -170,43 +110,6 @@ export class CustomClustersSupplier implements KubernetesClustersSupplier { return this.clusterDetails; } } -/* highlight-add-end */ - -export default async function createPlugin( - env: PluginEnvironment, -): Promise { - - /* highlight-remove-next-line */ - const { router } = await KubernetesBuilder.createBuilder({ - /* highlight-add-next-line */ - const builder = await KubernetesBuilder.createBuilder({ - logger: env.logger, - config: env.config, - /* highlight-remove-next-line */ - }).build(); - /* highlight-add-start */ - }); - builder.setClusterSupplier( - CustomClustersSupplier.create(Duration.fromObject({ minutes: 60 })), - ); - const { router } = await builder.build(); - /* highlight-add-end */ - - // .. - return router; -} -``` - -### New Backend System Custom cluster discovery - -To use Custom cluster discovery with the New Backend System you'll need to create a module and add it to your backend. Here's a very simplified example: - -```ts title="packages/backend/src/index.ts" -import { createBackend } from '@backstage/backend-defaults'; -import { createBackendModule } from '@backstage/backend-plugin-api'; -import { Duration } from 'luxon'; -import { kubernetesClusterSupplierExtensionPoint } from '@backstage/plugin-kubernetes-node'; -import { CustomClustersSupplier } from './path/to/class'; const backend = createBackend(); @@ -236,7 +139,7 @@ backend.start(); :::note Note -This example assumes the `CustomClustersSupplier` class is the same from the [previous example](#custom-cluster-discovery) +This example uses items from the `@backstage/plugin-kubernetes-node` and `luxon` packages, you'll need to add those for this example to work as is. :::