How to easily start Backstage

Hi, I'm Tak.
Today's topic is Backstage.

I'm interested Platform engineering, DevOps, Cloud Native.
So I selected it.

What is “Backstage” ?

Backstage is an open source IDP (Internal Developer Portal) developed by Spotify to improve developer productivity.

Point

1. To build Backstage
2. To make GitHub repository from Backstage
3. To add software template

Condition

• node v20.11.1
• yarn v1.22.22

1. To build Backstage

Type this command in terminal.

npx @backstage/create-app@latest

Type input app name, for example "test-backstage"

Type this command

cd test-backstage && yarn dev

Go to localhost:3000

Take a look this display.

2. To make GitHub repository from Backstage

First, Set GitHub access token in app-config.local.yaml

You make it, Go to https://github.com/settings/tokens/new,
So make access token.

And add this code in /package/backend/src/index.ts

backend.add(import('@backstage/plugin-scaffolder-backend-module-github'));

in some cases, type this command in terminal.

export NODE_OPTIONS=--no-node-snapshot

Then, Click "Create..." in sidebar.

Next, Click "CHOOSE",

Input Component name, then click "NEXT"

Input owner name and repository name, then click "REVIEW"

You check no problem, click "CREATE"

It's Created.

Go to GitHub, check repository list.

It's source code in repository.

Where are files in Backstage codes?

There are it in /examples/template/content directory.

3. To add software template

So add software template Laravel code.

For example, make /laravel-example/templatedirectory.

cd /laravel-example/template
composer create-project laravel/laravel content --prefer-dist

Copy & Paste from /examples/template/content/catalog-info.yaml to /laravel-example/template/content/catalog-info.yaml,
And Copy & Paste template.yaml, entities.yaml, org.yaml.

.
├── entities.yaml
├── org.yaml
└── template
    ├── content
    │   ├── README.md
    │   ├── app
    │   ├── artisan
    │   ├── bootstrap
    │   ├── catalog-info.yaml
    │   ├── composer.json
    │   ├── composer.lock
    │   ├── config
    │   ├── database
    │   ├── package.json
    │   ├── phpunit.xml
    │   ├── public
    │   ├── resources
    │   ├── routes
    │   ├── storage
    │   └── tests
    └── template.yaml

Then, add this code in app-config.yaml

    - type: file
      target: ../../laravel-example/template/template.yaml
      rules:
        - allow: [Template]

Kill yarn process, next yarn dev.
Take a look Create a new componet display.

So you can create laravel code repository.

Finish

Are you interested Backstage?
It's easily to build and use Backstage.
I'm learning it now, so I'd like to use it more.

Thanks to read it.
Have a good engineer life!!