Demo Exploring Backstage

In this demo, we’ll navigate Backstage’s Internal Developer Portal (IDP) features—from your company catalog to creating new services with templates. You’ll learn how to:

• Browse and filter entities
• Inspect component and API dashboards
• Search documentation with TechDocs
• Scaffold projects using built-in templates
• Customize your personal settings

Homepage and Company Catalog

When you first log in, Backstage presents the My Company Catalog, listing all software entities your organization manages. In our demo, you’ll see:

• example-website (a sample website component)

Clicking any entry surfaces metadata such as owner, system, component type, and lifecycle stage, enabling quick discovery of relationships across your platform.

Component Details

Select example-website to open its dashboard:

On the Overview tab you can:

• Jump to the source code repository
• Open TechDocs for in-depth documentation
• Review metadata: owner, system affiliation, type (website, API, library), and lifecycle (e.g., experimental)

Backstage also generates a relationship graph:

• Owned by the Guests group
• Belongs to the Example system
• Provides the example-grpc-api service/API

Click any node to navigate directly to related entities.

API Exploration

Back at the homepage, filter by APIs and choose example-grpc-api:

View the API’s definition in Protobuf:

syntax = "proto3";

service Example {
  rpc Example (ExampleMessage) returns (ExampleMessage);
}

message ExampleMessage {
  string example = 1;
}

For REST APIs, Backstage displays an OpenAPI/Swagger specification or similar docs instead.

Exploring Other Entities

Backstage models everything as an Entity. Use the sidebar to browse:

Filter or search (e.g., “example”) to quickly locate relevant entities and documentation.

My Company Catalog Interface

Viewing a Group (such as Guests) reveals:

• A list of owned components and APIs
• Associated users

Here’s a snippet of a sample group YAML configuration:

metadata:
  name: example
links:
  - url: https://dashboard.example.com
    title: My Dashboard
    icon: dashboard

Documentation (TechDocs)

All project documentation is accessible under Docs or via the View TechDocs button on any component or API dashboard. The global search indexes TechDocs, making it easy to find keywords and navigate directly to the relevant content.

Software Templates

Backstage’s Create menu lets you scaffold new projects from predefined templates. By default, an example Node.js template is available:

Steps to scaffold:

1. Select the template (e.g., Example Node.js Template).
2. Fill in required fields: project name, repository URL, etc.
3. Review and confirm to provision a new service automatically.

User Settings and Personalization

Under Settings, configure:

• Your profile and authentication provider
• UI preferences (light/dark theme)

Additional personalization:

• Star your favorite components for quick access
• Filter the catalog to display only entities owned by your team

Next Steps

You’ve now covered Backstage’s core features:

• Company catalog and entity dashboards
• TechDocs-powered documentation search
• Project scaffolding with software templates
• Personal settings and UI customizations

In upcoming sections, we’ll dive deeper into advanced catalog configurations, custom plugin development, and CI/CD integration to help you master Backstage end to end.

Links and References

• Backstage Documentation
• TechDocs Overview
• Backstage Plugin Marketplace
• Understanding Catalog Entities