🚀 VS Code で で入手しましょう!

コンテナー化されたアプリを Azure にデプロイする

このガイドでは、次の方法について説明します。

  • アプリケーションのコンテナーイメージを作成する。
  • コンテナーレジストリにイメージをプッシュする。
  • Azure App Service または Azure Container Apps にイメージをデプロイする。

前提条件

アプリケーションイメージの作成

既にイメージがある場合は、この手順をスキップして コンテナーレジストリへのイメージのプッシュ の手順に進んでください。

  1. VS Code でアプリケーションフォルダーを開きます。

  2. コマンドパレット (⇧⌘P (Windows、Linux Ctrl+Shift+P)) を開き、Docker Images: Build Image... コマンドを使用してイメージをビルドします。

    Build container image

    イメージ名は、[Build Image] コマンドの出力に表示されます。Docker Explorer の [Images] ペインでも確認できます。

    Build image output

コンテナーレジストリへのイメージのプッシュ

イメージを App Service または Container App にデプロイする前に、イメージをコンテナーレジストリにアップロードする必要があります。イメージは、Azure Container Registry (ACR) または Docker Hub のいずれかにアップロードできます。

  1. Docker Explorer を開き、[Registries] グループの下にある [Connect Registry...] アイコンを選択し、プロンプトに従います。プロバイダー (Azure または Docker Hub) を選択し、資格情報を提供してレジストリに接続します。

    Connect to Registry

  2. これで、レジストリが [Registries] の下に表示されます。

    Registries

  3. オプションで、イメージにタグを付けます。イメージをレジストリにアップロードするには、docker push が適切なレジストリにアップロードするように、イメージにレジストリ名をタグ付けする必要があります。

    • Azure ACR にレジストリを作成するには、Docker ビューの [Registries] セクションを開き、まだサインインしていない場合は Azure にサインインしてから、使用するサブスクリプションを右クリックし、[Create Registry] を選択します。

    • 前のセクションでビルドされたイメージが、Docker Explorer の [Images] セクションに表示されます。右クリックして [Tag...] を選択します。

      Tag image

    • 新しい名前 <your registry or username>/<image name>:<tag> を指定して、タグ付けアクションを完了します。たとえば、WebApp6 という名前の ACR の新しいイメージ名は 'webapp6.azurecr.io/webapp6:latest' になり、Docker Hub の場合は 'myusername/webapp6:latest' になります。

  4. イメージタグが指すレジストリの下の Docker Explorer にイメージが表示されます。このイメージを選択し、[Push] を選択します。イメージがまだタグ付けされていない場合は、プッシュ先のレジストリを選択するように求められ、選択に基づいてイメージにタグが付けられます。

    Push image

  5. push コマンドが完了したら、イメージがプッシュされたレジストリノードを更新すると、アップロードされたイメージが表示されます。

    Refresh registry

Azure へのイメージのデプロイ

前のセクションでは、イメージがリモートコンテナーレジストリにプッシュされました。次に、このイメージを Azure App Service または Azure Container Apps にデプロイします。

  1. Docker Explorer で、[Registries] の下のイメージに移動し、タグを右クリックして、[Deploy Image To Azure App Service...] または [Deploy Image to Azure Container Apps...] を選択します。

    Deploy to Azure App Service

  2. プロンプトが表示されたら、App Service または Container App の値を入力します。

    • 新しい Web アプリ名: 名前は Azure 全体で一意である必要があります。
    • リソースグループ: 既存のリソースグループを選択するか、新しいリソースグループを作成します。
    • App Service プラン: 既存の App Service プランを選択するか、新しいプランを作成します。(App Service プランは Web サイトをホストする物理リソースを定義します。このチュートリアルでは、Basic または Free プランの階層を使用できます)。

  3. デプロイが完了すると、Visual Studio Code に Web サイトの URL が通知として表示されます。

    Deployment complete notification

  4. Visual Studio Code の [出力] パネルの [Docker] セクションで結果を確認することもできます。

    Deployment complete output

  5. デプロイされた Web サイトを閲覧するには、Ctrl + クリック を使用して [出力] パネルで URL を開くことができます。アプリが Azure でライブになるまでしばらく時間がかかる場合があります。新しい App Service または Container App は Visual Studio Code の [Azure] ビューにも表示され、Web サイトを右クリックして [Web サイトの参照] を選択できます。

    Web Application

次のステップ

詳細については、以下をお読みください。

  • Azure 拡張機能 - VS Code マーケットプレースには、Azure およびクラウド向けの数百の拡張機能があります。
  • Azure へのデプロイ - アプリケーションを Azure にデプロイする方法をステップごとに学習します。
  • MongoDB の操作 - VS Code 内から MongoDB データベースを作成、管理、およびクエリします。
1/17/2023