From 3519cba9437238ce076b4ee2f9426db71651754c Mon Sep 17 00:00:00 2001 From: Deepthi Ajith Date: Wed, 28 Jan 2026 08:30:58 +0000 Subject: [PATCH] docs: add anchor links to quickstart-app-plugin tutorial sections Signed-off-by: Deepthi Ajith --- docs/tutorials/quickstart-app-plugin.md | 16 ++++++++-------- 1 file changed, 8 insertions(+), 8 deletions(-) diff --git a/docs/tutorials/quickstart-app-plugin.md b/docs/tutorials/quickstart-app-plugin.md index e9821f3f70..2df3e2381d 100644 --- a/docs/tutorials/quickstart-app-plugin.md +++ b/docs/tutorials/quickstart-app-plugin.md @@ -27,7 +27,7 @@ title: Adding Custom Plugin to Existing Monorepo App > here > > [simple-backstage-app-plugin](https://github.com/johnson-jesse/simple-backstage-app-plugin). -# The Skeleton Plugin +## The Skeleton Plugin 1. Start by using the built-in creator. From the terminal and root of your project run: `yarn new` and select `frontend-plugin`. @@ -45,7 +45,7 @@ title: Adding Custom Plugin to Existing Monorepo App 1. You should see successful verbiage for this endpoint, `Welcome to github-playground!` -# The Shortcut +## The Shortcut Let's add a shortcut. @@ -62,7 +62,7 @@ Simple! The App will reload with your changes automatically. You should now see a GitHub icon displayed in the sidebar. Clicking that will link to our new plugin. And now, the API fun begins. -# The Identity +## The Identity Our first modification will be to extract information from the Identity API. @@ -124,7 +124,7 @@ https://github.com/backstage/backstage/tree/master/contrib 6. Here is the entire file for reference [ExampleComponent.tsx](https://github.com/backstage/backstage/tree/master/contrib/docs/tutorials/quickstart-app-plugin/ExampleComponent.md) -# The Wipe +## The Wipe The last file we will touch is ExampleFetchComponent. Because of the number of changes, let's start by wiping this component clean. @@ -150,7 +150,7 @@ export const ExampleFetchComponent = () => { ###### We will add a lot to this file for the sake of ease. Please don't do this in productional code! -# The Graph Model +## The Graph Model GitHub has a GraphQL API available for interacting. Let's start by adding our basic repository query @@ -202,7 +202,7 @@ type Viewer = { }; ``` -# The Table Model +## The Table Model Using Backstage's own component library, let's define a custom table. This component will get used if we have data to display. @@ -234,7 +234,7 @@ export const DenseTable = ({ viewer }: DenseTableProps) => { }; ``` -# The Fetch +## The Fetch We're ready to flush out our fetch component @@ -299,7 +299,7 @@ return ( that backs this document, [simple-backstage-app-plugin](https://github.com/johnson-jesse/simple-backstage-app-plugin) -# Where to go from here +## Where to go from here > Break apart ExampleFetchComponent into smaller logical parts contained in > their own files. Rename your components to something other than ExampleXxx.