Add the plugin to your backend app:
yarn add --cwd packages/backend @procore-oss/backstage-plugin-announcements-backend
Create packages/backend/src/plugins/announcements.ts:
import {
  buildAnnouncementsContext,
  createRouter,
} from '@procore-oss/backstage-plugin-announcements-backend';
import { Router } from 'express';
import { PluginEnvironment } from '../types';
export default async function createPlugin({
  logger,
  database,
  permissions,
}: PluginEnvironment): Promise<Router> {
  const announcementsContext = await buildAnnouncementsContext({
    logger: logger,
    database: database,
    permissions: permissions,
  });
  return await createRouter(announcementsContext);
}
In packages/backend/src/index.ts add the following:
import announcements from './plugins/announcements';
// ...
async function main() {
  // ...
  const announcementsEnv = useHotMemoize(module, () =>
    createEnv('announcements'),
  );
  const apiRouter = Router();
  apiRouter.use('/announcements', await announcements(announcementsEnv));
  // ...
}
If you are migrating from the old backend system, you can delete
packages/backend/src/plugins/announcements.tsand follow the instructions below
Add the plugin to your backend app:
yarn add --cwd packages/backend @procore-oss/backstage-plugin-announcements-backend
Update packages/backend/src/index.ts to import announcements plugin package and register it in your backend using:
// ...
const backend = createBackend();
backend.add(import('@procore-oss/backstage-plugin-announcements-backend'));
// ...
Add the plugin to your frontend app:
yarn add --cwd packages/app @procore-oss/backstage-plugin-announcements
Expose the announcements page:
// packages/app/src/App.tsx
import { AnnouncementsPage } from '@procore-oss/backstage-plugin-announcements';
// ...
const AppRoutes = () => (
  <FlatRoutes>
    // ...
    <Route path="/announcements" element={<AnnouncementsPage />} />
    // ...
  </FlatRoutes>
);
An interface to create/update/edit/delete announcements is now available at /announcements.