Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More
Socket
Sign inDemoInstall
Socket

@roadiehq/backstage-plugin-code-insights

Package Overview
Dependencies
Maintainers
6
Versions
2
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

@roadiehq/backstage-plugin-code-insights

![a preview of the code insights plugin](https://raw.githubusercontent.com/RoadieHQ/backstage-plugin-code-insights/main/docs/code-insights-plugin.png)

  • 0.1.0
  • latest
  • npm
  • Socket score

Version published
Maintainers
6
Created
Source

Code Inights Plugin for Backstage

a preview of the code insights plugin

Plugin Setup

  1. If you have standalone app (you didn't clone this repo), then do
yarn add @roadiehq/backstage-plugin-code-insights
  1. Add plugin to the list of plugins:
// packages/app/src/plugins.ts
export { plugin as CodeInsights } from '@roadiehq/backstage-plugin-code-insights';
  1. Add plugin API to your Backstage instance:
// packages/app/src/components/catalog/EntityPage.tsx
import { Router as CodeInsightsRouter } from '@roadiehq/backstage-plugin-code-insights';

...

const ServiceEntityPage = ({ entity }: { entity: Entity }) => (
  <EntityPageLayout>
    ...
    <EntityPageLayout.Content
      path="/code-insights"
      title="Code Insights"
      element={<CodeInsightsRouter entity={entity} />}
    />
  </EntityPageLayout>
  1. Run backstage app with yarn start and navigate to services tabs.

Widgets setup

  1. You must install plugin by following the steps above to add widgets to your Overview. You might add only selected widgets or all of them.

  2. Add widgets to your Overview tab:

// packages/app/src/components/catalog/EntityPage.tsx
import { ContributorsCard, LanguagesCard, ReadMeCard, ReleasesCard } from '@roadiehq/backstage-plugin-code-insights';

...

const OverviewContent = ({ entity }: { entity: Entity }) => (
  <Grid container spacing={3}>
    ...
    <Grid item md={6}>
      <ContributorsCard entity={entity} />
      <LanguagesCard entity={entity} />
      <ReleasesCard entity={entity} />
    </Grid>
    <Grid item md={6}>
      <ReadMeCard entity={entity} />
    </Grid>
  </Grid>
);

Features

  • Add Code Insights plugin tab.
  • Show widgets about repository contributors, languages, readme and release at overview page.
  • Backstage
  • Get hosted, managed Backstage for your company: https://roadie.io

FAQs

Package last updated on 09 Oct 2020

Did you know?

Socket

Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.

Install

Related posts

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc