簡素化されたアーキテクチャガバナンス:NocoBaseでアプリケーションカタログを構築する

目標はを用いてコーディングなしでWebアプリケーションを開発する可能性と容易さを示すことです。

Leandro Martins |

(本記事はAIにより翻訳されました)

このブログは Leandro Martins によって作成され、最初にBuild Application Catalog with NocoBaseで公開されました。

目標は、NocoBaseを用いてコーディングなしでWebアプリケーションを開発する可能性と容易さを示すことです。案例として、アーキテクチャガバナンスを支援するアプリケーションカタログを作成します。この案例では、NocoBaseの機能を用いたモデリング、インストール、テーブル作成、メニュー、フォーム、チャート、ワークフローに関わる作業を行います。

この記事では、以下の技術を使用します:NocoBase、Postgres、Docker。

NocoBaseとは何ですか?

NocoBaseは、JavaScriptで書かれたオープンソースプラットフォームで、NodeJS、TypeScript、AntDesignを使用して、コーディングを必要とせずにカスタムアプリケーションを作成することを目的としています。ビジュアルでテーブル、カスタムフォーム、ワークフロー自動化、TAILORED INTERFACEの作成が可能になるローコードバックエンドソリューションです。

What is NocoBase?.png

NocoBaseの主要ハイライト:

  • 活発なコミュニティ:プラグイン開発とトラブルシューティングをサポートする活発なフォーラム。
  • 常にレビューされるコード:GitHubでの貢献により頻繁に更新され、13k以上のスターを獲得。
  • データベース互換性:PostgresやMySQLなどの主要なリレーショナルデータベースをサポート。
  • ビジュアルデータモデリング:メインデータベースプラグインを使用してテーブルとデータをビジュアルに定義。
  • 豊富なプラグインライブラリ:無料および有料のプラグインを幅広く提供し、カスタムプラグインの開発が可能。

Key Highlights of NocoBase.png

ケーススタディ概要

NocoBaseの機能をいくつか示すために、Architecture Portalと呼ばれるケーススタディを作成します。このポータルは、組織のアプリケーションに関するデータを組織し、以下の機能を特徴としています:

  • アプリケーションカタログ
  • 更新のリマインダー、例えばバージョンアップグレードや証明書の更新。
  • 組織のシステムのためのAPIカタログ
  • インサイトフルなデータ可視化のためのチャート

Case Study Overview.png

開発段階

データモデリング

最初のステップは、Architecture Portalに含めるフィールドをマッピングし定義することです。以下に例を示します:

1. Application Catalog

Applications:
id: Unique identifier.
name: Application name.
description: Detailed description of the application.
stack: Technologies used.
owner: Responsible person or team.
created_at: Creation date.
last_updated: Last update date.

Reminders (Linked to Applications):
id: Unique identifier.
application_id: Reference to the application.
type: Reminder type (e.g., version update, certificate renewal).
description: Reminder description.
scheduled_date: Scheduled date for the reminder.
status: Status (e.g., Pending, Completed).

2. API Catalog

APIs:
id: Unique identifier.
Application_id: Reference to the corresponding system.
name: API name.
description: Functional description of the API.
documentation_url: Link to the official documentation.
last_updated: Last update date.
version: Current version.

NocoBaseのインストール

インストール と設定では、ローカルでDockerバージョンを使用することにしました。他のインストールオプションにはnpmやGitソースがあります。

以下はDocker ComposeのYAMLコードです。Dockerをインストールした後、YAMLファイルディレクトリに移動し、以下のコマンドを実行します:

docker compose up -d

これにより、あなたのマシン上でNocoBaseが起動し、デフォルトポートは 13000 です。ブラウザで を開いてください。デフォルトのログイン資格情報は admin@nocobase.comadmin123 です。

version: '3'

networks:
  nocobase:
    driver: bridge

services:
  app:
    image: nocobase/nocobase:beta
    networks:
      - nocobase
    depends_on:
      - postgres
    environment:
      # The application's secret key, used to generate user tokens, etc.
      # If APP_KEY is changed, old tokens will also become invalid.
      # It can be any random string, and make sure it is not exposed.
      - APP_KEY=your-secret-key
      # Database type, supports postgres, mysql, mariadb
      - DB_DIALECT=postgres
      # Database host, can be replaced with the IP of an existing database server
      - DB_HOST=postgres
      # Database name
      - DB_DATABASE=nocobase
      # Database user
      - DB_USER=nocobase
      # Database password
      - DB_PASSWORD=nocobase
      # Timezone
      - TZ=Asia/Shanghai
    volumes:
      - ./storage:/app/nocobase/storage
    ports:
      - '13000:80'
    # init: true

  # If using an existing database server, postgres service can be omitted
  postgres:
    image: postgres:16
    restart: always
    command: postgres -c wal_level=logical
    environment:
      POSTGRES_USER: nocobase
      POSTGRES_DB: nocobase
      POSTGRES_PASSWORD: nocobase
    volumes:
      - ./storage/db/postgres:/var/lib/postgresql/data
    networks:
      - nocobase

テーブルとデータの作成

データソースマネージャープラグインを使用して、コレクション(テーブル)を作成しフィールドを定義できます。プロセスはシンプルで、上記に示されたモデルに従います。プラグインの詳細についてはこちらをご覧ください。

Creating Tables and Data.png

Creating Tables and Data.png

メニューの作成

画面右側の鉛筆のようなアイコンをクリックすると、トップメニューとサイドメニューを作成できます。画像に示すようにそれを複製しましょう。

Creating Menus.png

フォームの作成

フォーム(CRUD)の作成も非常に簡単です。NocoBaseでは、ブロックを使用してテーブル、フォーム、詳細、リスト、チャート、カードなどを作成します。ブロックのタイプを選択後、どのコレクション(テーブル)をこのブロックにリンクさせたいか選択すると、そのコレクションにリンクされたコンポーネント(ブロック)が魔法のように表示されます。各ブロックには独自のカスタマイズ設定があります。ブロックの詳細については[こちら]を参照してください。

Creating Forms.png

チャートの作成

チャートの構築も簡単です。Chartと呼ばれるブロックを追加し、データソースとして使用したいコレクションを選択します。画像の下に示します。

Creating Charts.png

ブロックを選択後、チャートのプロパティを設定できます。画像の下にチャート設定オプションを示します。ここでは、指標、グループ化、フィルター、各種チャートタイプ、タイトルなどの利用可能なプロパティを定義できます。ここでは、すべての設定可能性を探求できます。

Creating Charts.png

リマインダーのためのスケジュールワークフローの作成

NocoBaseでは、イベントを通じてさまざまなタイプのタスクを自動化してワークフローを作成できます。トリガーの3つのタイプは:*コレクションイベント、スケジュールイベント、およびポストアクションイベント。*これらのトリガーを使用して、システム内のアクションを作成できます。例えば、通知を送信したり、他のテーブルにデータを挿入したり、外部APIにリクエストを送信したりできます。下の画像は、アプリケーション内での通知送信のためのワークフローの例です。

Workflow.png

私たちの場合、リマインダーの予定日に通知を送信するワークフローを作成します。これは、特定の時間に毎日実行されるスケジュールイベントです。画像の下に示します。

Workflow.png

Workflow.png

さらに、スケジュールを設定するだけでなく、ワークフローを設定してリマインダーコレクションを照会し、当日のリマインダーを取得し、それぞれをループして、各リマインダーの通知を送信します。画像の下に示します。プロセスは簡単です:ただこれらのアクションを”+“ボタンをクリックして追加し、設定するだけです。

Workflow.png

設定を完了すると、右上隅の”On”ボタンをクリックしてワークフローをアクティブにします。実行結果を表示するには、右上隅の”…”をクリックし、実行履歴を選択します。画像の下に示します。

Workflow.png

結論

上面に示されたように、NocoBaseはアプリケーション開発を加速させる多くの機能を提供します。規模や要件に応じて、ファイル管理、国際化、モバイルサポート、テーマ編集などの機能を柔軟に構築でき、独自のプラグインを開発したり、マーケットプレイスで商用プラグインを購入することもできます。

関連文献: