コード取得設定との連携
コード管理のリポジトリでビュー(コードエディター)のコードも一緒に管理し、コード取得設定と組み合わせて運用する例です。
アクションとビューの変更を同じPRでレビューできるため、関連する変更をまとめて管理できます。
リポジトリ構造の例
my-project/
├── basemachina.config.ts
├── actions/
│ ├── get-users.ts
│ └── fetch-view-code.ts # ビューのコードを取得するアクション
└── views/
└── user-list/
└── index.tsx # ビューのコード仕組み
ビューのコード管理は、以下の流れで動作します。
- リポジトリ内の
views/ディレクトリにビューのコードを配置する - CI/CDで、ビューのコードをビルドしてストレージ(GCSやS3など)にアップロードする
- ベースマキナのビューでコード取得設定を有効化し、ストレージからコードを取得するアクションを指定する
- ビューを表示するたびに、ストレージから最新のコードが読み込まれる
GitHub Actionsの設定ファイル例
以下は、ビューのコードをビルドしてGCSにアップロードするワークフローの例です。アクションの反映(bm push)と合わせて実行します。
開発環境への反映(.github/workflows/push.yml)
name: Push to dev
on:
pull_request:
branches: [main]
push:
branches: [main]
jobs:
push:
runs-on: ubuntu-latest
steps:
- uses: actions/checkout@v4
- uses: actions/setup-node@v4
with:
node-version: 20
- run: npm ci
# アクションの差分検出・反映
- name: Dry run
if: github.event_name == 'pull_request'
run: bm push --dry
env:
BASEMACHINA_TOKEN: ${{ secrets.BASEMACHINA_TOKEN }}
- name: Push
if: github.event_name == 'push'
run: bm push
env:
BASEMACHINA_TOKEN: ${{ secrets.BASEMACHINA_TOKEN }}
# ビューのビルド・アップロード
- name: Build views
if: github.event_name == 'push'
run: npm run build:views
- name: Upload to GCS (dev)
if: github.event_name == 'push'
uses: google-github-actions/upload-cloud-storage@v2
with:
path: dist/views
destination: my-bucket/devストレージへのアップロード方法は使用するサービス(GCS、S3など)に合わせて変更してください。
環境ごとのコードの切り替え
変数と組み合わせることで、環境ごとに異なるビューのコードを読み込めます。
例えば、ストレージのパスに環境ごとの変数をプレフィックスとして設定することで、開発環境と本番環境で異なるコードを使用できます。
詳しくはGit管理の「branchの切り替え」をご参照ください。