開発者向けノート: Azure と Github Actions を使用してノード JS プロジェクトの CI/CD パイプラインを構成する

エンジニアが何かをするときは、それをどのように達成したかについて書くべきだ、と誰かが Twitter に投稿しました。他のエンジニアが解決策を見つけるために検索する時間を節約できます。それが私たちがここにいる理由です。

この記事では、クラウド プロバイダーとして Azure を使用し、GitHub アクションを使用して、ノード JS プロジェクトの CI/CD パイプラインを構成します。

まずは

1. Microsoft Azure 上に App Service を作成します。

• Microsoft Azure ポータルにログオンするか、アカウントをお持ちでない場合は作成します。 (この記事の執筆時点では、新しいアカウントには最大 200 ドルのクレジットが与えられます。

• 次に、azure アプリを検索します。
  

• [作成] を選択 >ウェブアプリ。次に、フォームに詳細を入力します。ランタイム スタックを Node xx LTS として選択します。まで作り続けます。

プロセスの最後には、Microsoft のデフォルト ページを含む Web アプリが完成するはずです。

次は

2. Github アクション用の Azure 資格情報を生成します。

ここにはいくつかの方法が記載されていますが、非常に簡単であるため、サービス プリンシパル オプションを使用しています。

Azure cli を開きます (下の図に示されています)

そして次のコマンドを実行します:

az ad sp create-for-rbac --name "myApp" --role contributor --scopes /subscriptions//resourceGroups//providers/Microsoft.Web/sites / --json-auth

と を、Azure App Service ダッシュボードの正しい詳細に置き換えます。 「myApp」はサービス プリンシパルの名前です。

コマンドは次のような出力を生成します。

{
"clientId": "",
"clientSecret": "",
"subscriptionId": "",
"テナント ID": "",
(...)
}

これは後で使用します。

ついに Github へ

3. シークレットを追加し、Github アクションとトリガーを作成します。

• リポジトリで、設定 > に移動します。シークレットと変数 >アクション。

• 「新しいリポジトリ シークレットを追加」をクリックします。 json 出力をそのまま Secret フィールドに貼り付け、AZURE_CREDENTIALS を name フィールドに貼り付けます。

• 「アクション」タブに移動して、Github アクション フローをプロジェクトに追加します。 「Node.js を Azure Web App にデプロイ」を検索し、「構成」をクリックして続行します。

  • ワークフロー ファイル azure-webapps-node.yml が作成され、変更をコミットする前に編集できます。

以下のようにファイルを編集します:

`on:
プッシュ:
ブランチ: [ "開発" ]
workflow_dispatch:

環境:
AZURE_WEBAPP_NAME: # これをアプリケーションの名前に設定します
AZURE_WEBAPP_PACKAGE_PATH: '.' # これを Web アプリ プロジェクトへのパスに設定します。デフォルトはリポジトリ ルート
NODE_VERSION: '' # これを使用するノードのバージョンに設定します

権限:
内容: 読む

ジョブ:
ビルドとデプロイ:
実行: ubuntu-latest
手順:
- 名前: 'Github アクションをチェックアウト'
使用:actions/checkout@v4

- uses: azure/login@v1
  with:
    creds: ${{ secrets.AZURE_CREDENTIALS }}

- name: Setup Node ${{ env.NODE_VERSION }}
  uses: actions/setup-node@v4
  with:
    node-version: ${{ env.NODE_VERSION }}
    cache: 'npm'

- name: npm install, build, and test
  run: |
    npm install

- uses: azure/webapps-deploy@v3
  with:
    app-name: ${{ env.AZURE_WEBAPP_NAME }}
    package: ${{ env.AZURE_WEBAPP_PACKAGE_PATH }}

# Azure logout 
- name: logout
  run: |
    az logout`

ワークフロー ファイルは、開発ブランチへのプッシュ時にトリガーされ、以前にシークレットに保存した資格情報を使用して Azure ポータルにログインし、ビルドとデプロイを続行します。

Web アプリ名、ノードのバージョンを適宜置換編集してください。

最後に、最初の実行のワークフローをトリガーします。 Azure portal 上の既定の Web ページが表示されなくなり、開発ブランチへのプッシュ時にトリガーされる CI/CD パイプライン用に Web アプリが構成されます。

これが他のエンジニアのお役に立てば幸いです。

以上が開発者向けノート: Azure と Github Actions を使用してノード JS プロジェクトの CI/CD パイプラインを構成するの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。