diff --git a/workspaces/npm/.changeset/fast-windows-grin.md b/workspaces/npm/.changeset/fast-windows-grin.md
new file mode 100644
index 0000000000..cf370b26c1
--- /dev/null
+++ b/workspaces/npm/.changeset/fast-windows-grin.md
@@ -0,0 +1,5 @@
+---
+'@backstage-community/plugin-npm': patch
+---
+
+add standalone demo application
diff --git a/workspaces/npm/plugins/npm/dev/index.tsx b/workspaces/npm/plugins/npm/dev/index.tsx
index 0b699a0995..75a36083dc 100644
--- a/workspaces/npm/plugins/npm/dev/index.tsx
+++ b/workspaces/npm/plugins/npm/dev/index.tsx
@@ -15,13 +15,48 @@
  */
 import React from 'react';
 import { createDevApp } from '@backstage/dev-utils';
-import { npmPlugin } from '../src/plugin';
+import { npmPlugin, NpmReleases } from '../src/plugin';
+import { EntityProvider } from '@backstage/plugin-catalog-react';
+import { NpmInfoCard } from '../src/components/NpmInfoCard';
+import { Content, Header, Page } from '@backstage/core-components';
+import { Grid } from '@material-ui/core';
 
+const mockEntity = {
+  apiVersion: 'backstage.io/v1alpha1',
+  kind: 'Component',
+  metadata: {
+    name: 'backstage-plugin-catalog',
+    annotations: {
+      'npm/package': '@backstage/plugin-catalog',
+    },
+  },
+  spec: {
+    type: 'website',
+    lifecycle: 'production',
+    owner: 'guests',
+  },
+};
 createDevApp()
   .registerPlugin(npmPlugin)
   .addPage({
-    element: <div />,
-    title: 'Root Page',
+    element: (
+      <Page themeId="tool">
+        <Header title="Npm demo application" subtitle="standalone app" />
+        <Content>
+          <EntityProvider entity={mockEntity}>
+            <Grid container>
+              <Grid item xs={8}>
+                <NpmReleases />
+              </Grid>
+              <Grid item xs={4}>
+                <NpmInfoCard />
+              </Grid>
+            </Grid>
+          </EntityProvider>
+        </Content>
+      </Page>
+    ),
+    title: 'Npm',
     path: '/npm',
   })
   .render();
diff --git a/workspaces/npm/plugins/npm/src/plugin.ts b/workspaces/npm/plugins/npm/src/plugin.ts
index dd1d290b6d..fa5b9d36da 100644
--- a/workspaces/npm/plugins/npm/src/plugin.ts
+++ b/workspaces/npm/plugins/npm/src/plugin.ts
@@ -13,7 +13,10 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-import { createPlugin } from '@backstage/core-plugin-api';
+import {
+  createPlugin,
+  createRoutableExtension,
+} from '@backstage/core-plugin-api';
 
 import { rootRouteRef } from './routes';
 
@@ -28,3 +31,15 @@ export const npmPlugin = createPlugin({
     root: rootRouteRef,
   },
 });
+
+/** @public */
+export const NpmReleases = npmPlugin.provide(
+  createRoutableExtension({
+    name: 'NpmReleasesTable',
+    component: () =>
+      import('./components/NpmReleaseTableCard').then(
+        m => m.NpmReleaseTableCard,
+      ),
+    mountPoint: rootRouteRef,
+  }),
+);