Backstage Nexus Repository Manager Plugin

Install the frontend package

1. From the repository root run

   Copy

   yarn workspace app add @backstage-community/plugin-nexus-repository-manager

Configure the proxy in app config

1. Open app-config.yaml in the root of your Backstage repo

2. Add a proxy endpoint for your Nexus Repository Manager

   Copy

   proxy:
     endpoints:
       '/nexus-repository-manager':
         target: 'https://<NEXUS_REPOSITORY_MANAGER_URL>'
         headers:
           X-Requested-With: 'XMLHttpRequest'
           # Uncomment to access a private Nexus Repository Manager using a token
           # Authorization: 'Bearer <YOUR TOKEN>'
         changeOrigin: true
         # Set to false if your Nexus uses a self signed certificate
         secure: true

Optional custom proxy path

1. If you want a different base path then set a custom path in config

2. Make the proxy endpoints key match the same path

   Copy

   nexusRepositoryManager:
     proxyPath: /custom-path
   proxy:
     endpoints:
       '/custom-path':
         target: 'https://<NEXUS_REPOSITORY_MANAGER_URL>'
         headers:
           X-Requested-With: 'XMLHttpRequest'
           # Authorization: 'Bearer <YOUR TOKEN>'
         changeOrigin: true
         secure: true

Enable the proxy backend

New backend system

1. Add the proxy backend package to the backend workspace

   Copy

   yarn workspace backend add @backstage/plugin-proxy-backend

2. Register the proxy plugin in packages/backend/src/index.ts

   Copy

   // packages/backend/src/index.ts
   import { createBackend } from '@backstage/backend-defaults';
   import { proxy } from '@backstage/plugin-proxy-backend';
   
   const backend = createBackend();
   
   backend.add(proxy());
   
   backend.start();

Old backend system

1. Add the proxy backend package to the backend workspace

   Copy

   yarn workspace backend add @backstage/plugin-proxy-backend

2. Create packages/backend/src/plugins/proxy.ts

   Copy

   // packages/backend/src/plugins/proxy.ts
   import { createRouter } from '@backstage/plugin-proxy-backend';
   import { Router } from 'express';
   import { PluginEnvironment } from '../types';
   
   export default async function createPlugin(env: PluginEnvironment): Promise<Router> {
     return await createRouter({
       logger: env.logger,
       config: env.config,
       discovery: env.discovery,
       tokenManager: env.tokenManager,
       httpAuth: env.httpAuth,
     });
   }

3. Wire the proxy router in packages/backend/src/index.ts Your backend likely has a helper like createEnv plus useHotMemoize along with an apiRouter mounted at path api Mount the proxy router under api proxy

   Copy

   // packages/backend/src/index.ts
   import proxy from './plugins/proxy';
   
   // inside the main bootstrap function
   const proxyEnv = useHotMemoize(module, () => createEnv('proxy'));
   apiRouter.use('/proxy', await proxy(proxyEnv));

Add the Nexus tab to the service entity page

1. Edit packages/app/src/components/catalog/EntityPage.tsx

2. Import the page plus the availability checker

3. Add an EntityLayout route so the tab shows on service entities

   Copy

   // packages/app/src/components/catalog/EntityPage.tsx
   import {
     isNexusRepositoryManagerAvailable,
     NexusRepositoryManagerPage,
   } from '@backstage-community/plugin-nexus-repository-manager';
   
   const serviceEntityPage = (
     <EntityLayout>
       {/* other routes */}
       <EntityLayout.Route
         if={isNexusRepositoryManagerAvailable}
         path="/build-artifacts"
         title="Build Artifacts"
       >
         <NexusRepositoryManagerPage />
       </EntityLayout.Route>
     </EntityLayout>
   );

   You can repeat the same route on other entity pages if you want it for more kinds of components

Annotate your entities

1. Add an annotation to each entity that should show Nexus data

2. Commit the catalog file change in your repo

   Copy

   # catalog-info.yaml
   apiVersion: backstage.io/v1alpha1
   kind: Component
   metadata:
     name: my-service
     annotations:
       nexus-repository-manager/docker.image-name: "<ORGANIZATION>/<REPOSITORY>"
   spec:
     type: service
     owner: team-a
     lifecycle: production

Optional experimental annotations

1. Enable experimental annotations in app-config.yaml

   Copy

   nexusRepositoryManager:
     experimentalAnnotations: true

2. Swap the import in EntityPage.tsx

   Copy

   import {
     isNexusRepositoryManagerExperimentalAvailable as isNexusRepositoryManagerAvailable,
     NexusRepositoryManagerPage,
   } from '@backstage-community/plugin-nexus-repository-manager';

   Experimental annotations are not thoroughly tested