🚀 VS Code で ！

Visual Studio Code で Java Web アプリ

このチュートリアルでは、Visual Studio Code で Java Web アプリケーションを作成する方法について説明します。Java Web アプリケーションを Azure App Service の Linux Tomcat サーバーにデプロイする方法を学習します。

シナリオ

シンプルな Hello World Web アプリ。

Greeting from Java

始める前に

このサンプルを実行およびデプロイする前に、ローカル開発環境に Java SE Development Kit (JDK) と Apache Maven ビルドツールが必要です。お持ちでない場合は、インストールしてください。

Extension Pack for Java をダウンロードしてインストールします。これには JDK 11 が含まれています。

注: このチュートリアルを完了するには、JAVA_HOME 環境変数を JDK のインストール場所に設定する必要があります。

Apache Maven バージョン 3 以降をダウンロードする

Apache Maven をダウンロード

ローカル開発環境に Apache Maven をインストールする

Apache Maven をインストール

Maven Web アプリプロジェクトを作成する

maven-archetype-webapp は、Maven Web アプリプロジェクトを生成するアーキタイプです。詳細については、このドキュメントを参照してください。

  1. 空のフォルダーで、次のコマンドを実行して、Maven アーキタイプから新しいプロジェクトを生成します。
   mvn archetype:generate -DarchetypeGroupId=org.apache.maven.archetypes -DarchetypeArtifactId=maven-archetype-webapp -DarchetypeVersion=1.4

  1. Maven は、デプロイメントでプロジェクトの生成を完了するために必要な値を要求します。プロンプトが表示されたら、次の値を入力します。

    プロンプト 値 説明
    groupId com.webappproject Java の パッケージ命名規則 に従って、すべてのプロジェクトでプロジェクトを一意に識別する値。
    artifactId webapp-project バージョン番号のない jar の名前である値。
    version 1.0-SNAPSHOT 既定値を選択します。
    package com.webappproject 生成された関数コードの Java パッケージである値。既定値を使用します。

  2. Y と入力するか、Enter キーを押して確定します。

    Maven は、artifactId という名前の新しいフォルダーにプロジェクトファイルを作成します。この例では webapp-project です。

  3. プロジェクトフォルダーに移動します

    cd webapp-project

Web アプリをクラウドにデプロイする

Java Web アプリケーションを構築し、ローカルで実行しました。次に、Visual Studio Code からデプロイし、クラウドの Azure で実行する方法を学習します。

Azure サブスクリプションをお持ちでない場合は、無料の Azure アカウントにサインアップできます。

無料の Azure アカウントを作成する

Azure App Service 拡張機能をインストールする

Azure App Service 拡張機能は、Azure App Service を作成、管理、およびデプロイするために使用され、主な機能は次のとおりです。

  • 新しい Azure Web App/デプロイメントスロットを作成する
  • Azure Web App/デプロイメントスロットにデプロイする
  • Azure Web App/デプロイメントスロットを開始、停止、および再起動する
  • Web アプリのログファイルを表示する
  • デプロイメントスロットをスワップする

Azure App Service 拡張機能をインストールするには、拡張機能ビュー (⇧⌘X (Windows、Linux Ctrl+Shift+X)) を開き、azure app service を検索して結果をフィルター処理します。Microsoft の Azure App Service 拡張機能を選択します。よりコマンドラインの Maven 中心のエクスペリエンスについては、Maven plugin for Azure App Service Linux チュートリアルも確認できます。

Azure サブスクリプションにサインインする

Azure にサインインするには、コマンドパレット (⇧⌘P (Windows、Linux Ctrl+Shift+P)) から Azure: サインイン を実行します。または、リソース エクスプローラーで Azure にサインイン... をクリックして、Azure アカウントにサインインすることもできます。

Azure sign in code

Azure で新しい Web アプリを作成する

拡張機能がインストールされたら、次の手順に従って Azure で新しい Web アプリを作成できます。

  1. リソース エクスプローラービューの 作成 ボタンをクリックし、App Service Web App の作成... を選択します。

  2. 新しい Web アプリの一意の名前を入力します。

  3. Web アプリのランタイムタスク (例: Java 17) を選択します。

  4. Java Web サーバーのスタック (例: Apache Tomcat 10.0) を選択します。

  5. 価格レベル (例: Free(F1)) を選択します。

Create a Web App

Web アプリをビルドしてデプロイする

デプロイプロセスでは、Azure Resources 拡張機能 (Azure App Service 拡張機能とともに依存関係としてインストール) を利用し、Azure サブスクリプションでサインインする必要があります。Azure サブスクリプションをお持ちでない場合は、今すぐサインアップして無料の 30 日間アカウントを取得し、Azure サービスを試すための Azure クレジット $200 を取得してください。

サインインしたら、コマンドプロンプトまたはターミナルウィンドウを開き、Maven コマンドを使用してプロジェクトをビルドできます。これにより、target ディレクトリに新しい war または jar アーティファクトが生成されます。

mvn clean package

プロジェクトをビルドした後、VS Code エクスプローラーで target ディレクトリを開きます。アーティファクトを右クリックして Web アプリにデプロイ を選択し、プロンプトに従ってデプロイする Web アプリを選択します。

Deploy to Web App

VS Code で 出力 ウィンドウを開き、デプロイログを表示します。デプロイが完了すると、Web アプリの URL が出力されます。リンクをクリックしてブラウザーで開くと、Azure で実行されている Web アプリを確認できます。

Greeting from Spring Boot

注: App Service のより高度な機能については、Azure App Service 拡張機能を確認してください。

リソースをクリーンアップする

  1. Web アプリを削除するには、リソース エクスプローラーに移動し、App Services 項目を見つけます。

  2. 削除する Web アプリを右クリックし、削除 をクリックします。

Delete the Web App Resources

  1. App Service プランまたはリソースグループを削除するには、Azure portal にアクセスし、サブスクリプションのリソースを手動で削除します。

次のステップ

3/2/2023