The Kong Service Manager plugin offers the facility to manipulate your service from different Kong environments, in your component, detailing information about the service, listing the routes it has and also offering the possibility of manipulating plugins without leaving the backstage.
💬 Join Us
Join our community to resolve questions about our Plugins. We look forward to welcoming you!
Before installing the plugin, there are some prerequisites to ensure its functionality:
- Have a locally installed Backstage project, ✔️ How to create a Backstage app 📃 .
- Have the
Kong Service Manager Backend
plugin installed on your Backstage, see how to install here.
If you are using yarn 3.x:
yarn workspace app add @veecode-platform/plugin-kong-service-manager
If you are using other versions:
yarn add --cwd packages/app @veecode-platform/plugin-kong-service-manager
1- Add Kong key in AppConfig
In the app-config.yaml
file, add the configuration:
ℹ️ As instructed in the documentation for the backend plugin.
kong:
instances:
- id: kong-instance01
apiBaseUrl: ${ KONG_HOST ]
workspace: ${ KONG_WORKSPACE } # or "default"
auth:
kongAdmin: ${ KONG_ADMIN_TOKEN } # optional if the instance is enterprise
custom: # optional if the kong is in community mode and depending on the authentication used
header: ${ KONG_HEADER } # Ex: Authorization or key-auth
value: ${ KONG_AUTH } # Ex: Basic $your_token or how the token is added depending on the approach
2- Annotations
The Plugin recognizes 2 annotations for its operation, the first being kong-manager/service-name
, which will identify the service that will be used as a parameter. In this annotation, you can enter the name of the service or its id, preferably the name. It is also important to note that each catalog-info.yaml
can only receive one service.
The other annotation will be kong-manager/instance
, which will receive the instances on which kong will make the calls, it can receive more than one item, properly separated by commas and without spaces. It is important to note that the instances must be configured in app-config.yaml
, as described in the previous section; if they have not been configured correctly, the calls will not be answered.
Here's an example:
apiVersion: backstage.io/v1alpha1
kind: Component
metadata:
name: "Component A"
description: "An example"
annotations:
github.com/project-slug: test/ComponentA
backstage.io/techdocs-ref: dir:.
+ kong-manager/service-name: nameservice_test_A01
+ kong-manager/instance: kongInstance1,kongInstance2
spec:
type: service
lifecycle: prod
owner: "devops"
Taking into account that the settings are ok, we now need to adjust our EntityPage.tsx
to render the plugin correctly.
To do this, we'll change the following file packages > app > src > components > catalog > EntityPage.tsx
:
...
+ import { KongServiceManagerContent, isKongServiceManagerAvailable } from '@veecode-platform/plugin-kong-service-manager';
...
const serviceEntityPage = (
<EntityLayout>
<EntityLayout.Route path="/" title="Overview">
{overviewContent}
</EntityLayout.Route>
<EntityLayout.Route path="/ci-cd" title="CI/CD">
{cicdContent}
</EntityLayout.Route>
+ <EntityLayout.Route
+ if={isKongServiceManagerAvailable}
+ path="/kong-service-manager" title="Kong">
+ <KongServiceManagerContent/>
+ </EntityLayout.Route>
</EntityLayout>
);
...
ℹ️ We've used the
ServiceEntityPage
component for the example, but it can be replicated for any of the existing types in theEntityPage
.
Now that the plugin is properly configured, let's take a look at the screens it offers:
Here we've highlighted all the information about the service referenced in the component, note that in the top right corner we have a combobox where we can navigate between the available kong instances:
- List of all routes for your Kong instance; ✅
- Create / Removing and Editing a route at your Service; ✅
- Filtering by the routes created in the service; ✅
On this screen, we list all the routes that the service has:
Also noteworthy is the behavior of the tags
field, which expands when triggered:
In the actions column, you can edit a route or delete it. You can also create new routes with the “create” button:
Finally, we have the list of plugins:
- List of all plugins eligible for your Kong instance; ✅
- Installing / Removing and Editing a plugin at your Service; ✅
- Plugin search field; ✅
- Filtering by the plugins installed in the service; ✅
For the example, we'll use the rate limiting plugin:
When you install it, it will appear on the Associated Plugins
tab:
From then on, the plugin will already be configured in your service:
💡 See more about Kong:
Kong Docs: https://docs.konghq.com/