1
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 1 year has passed since last update.

IntelliJ IDEAで Spring Boot を Azure App Service (WebApps)へデプロイする

Last updated at Posted at 2022-06-21

.NET Framework1.0 が世に出た時から仕事で C# を使っていますが、Java は15年ぐらい前に少し触った程度の私です。これから IntelliJ IDEA と Spring Boot を使ってあれこれ試していきたいと思います。どっちも初心者なので、突っかかったところを正直に書いていきたいと思います。

環境

JDK と Maven にはPathを通してあり、環境変数 JAVA_HOME が設定済みです。
また、事前に Azure App Service を Linux で作成しています。

Spring Initializr

まずは Spring Boot のひな形のプロジェクトをダウンロードします。Spring Initializr というWebサイトで様々なミドルウェアをセットアップする情報が pom.xml に記載された状態でダウンロードできます。

Spring Initializr

今回は Dependencies に Spring Web だけを入れています。 Artifact は FirstSpringWebApp という名前にしました。
image.png

左下の GENERATE ボタンをクリックすると、Zipファイルをダウンロードすることができます。Zipファイルを Explorer の機能で解凍してもいいのですが、フォルダが余計に1つできてしまうので私は Explorer で Zipファイルの中に入って、直下のフォルダをコピーして管理したい場所へ貼り付けています。

image.png

IntelliJ IDEA でプロジェクトを開く

プロジェクトとは Spring Initializr からダウンロードした Zip ファイルの中のフォルダを Local のどこかに貼り付けた、そのフォルダのことです。

IntelliJ を立ち上げて、開くをクリックしてプロジェクトを選びます。
image.png

Javaのプロジェクトとして IntelliJ IDEA が認識しているとフォルダのアイコンが他と違うことがわかります。このアイコンの違いは覚えておいたほうがいいです。
image.png

IntelliJ IDEA はプロジェクトの読み込みに少し時間がかかります。右下に色んな処理がされていることを示すプログレスバーが表示されている間は、大人しく待った方が良いみたいです。
image.png

Maven ウィンドウ

海外のエンジニアの人の動画を見ていて気付いたのですが、プロジェクトを IntelliJ IDEA で開くと自動的に pom.xml を読み込んで必要なミドルウェアをダウンロードしてくれますが、初めてプロジェクトを開いたときは念のため pom.xml の内容を再読み込みすると良いみたいです。

プログレスバーの表示が終わったら、 Maven ウィンドウを出しましょう。
image.png

再読み込みボタンをクリックします。
image.png

ローカルで実行

ひとまず何か表示させる実装して、ローカルで実行して問題がないことを確認します。まずは HelloController を Controller ディレクトリ配下に作成します。

src\main\java\com.example.FirstSpringWebApp を右クリックして、新規->Java クラスを選択します。
image.png

クラス名に controller.HelloController と入力します。このように入力すると、controller ディレクトリは自動的に作成されます。便利ですね。
image.png

Git にファイルを追加しますか、と聞いてきますが、今回はキャンセルしておきます。
image.png

HelloController が Controller ディレクトリの下に作成されます。
image.png

HelloControllerに文字列を返す実装をします。コントローラーを RestController アノテーションで修飾します。
クラス名の1行上に @RestController と入力していきます。

image.png

@RestController 、と入力していくと途中で「これを入力したいの?」と IntelliJ がコード補完をしようとしてくれます。この状態で Tab または Enter を押下すると、コード補完とともに import も書いてくれるのでとても便利です。私は Tab で選択するのが好みです。
image.png

HelloController.java
package com.example.FirstSpringWebApp.controller;

import org.springframework.web.bind.annotation.RestController;

@RestController
public class HelloController {
}

root へアクセスされたら "Hello Spring Boot!" という文字列を返却するように実装します。String 型を返却するメソッドを public で作成し、 GetMapping アノテーションで修飾します。 GetMapping は HTTP Get でアクセスされた時にだけ呼び出されることを定義するアノテーションで、引数に Path を設定します。ASP.NET Core でも HttpGet 属性で同じことができますね。

HelloController.java
package com.example.FirstSpringWebApp.controller;

import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.RestController;

@RestController
public class HelloController {

    @GetMapping("/")
    public String hello() {
        return "Hello Spring Boot!";
    }
}

実行してみましょう。エントリポイントは src\main\java\com.example.FirstSpringWebApp 直下に既定で作成済みの FirstSpringWebAppApplication クラスにあります。これをダブルクリックして開いたら main メソッドの左側に緑色の三角が行番号のところに表示されているはずです。(三角が表示されるまで最初は数秒待つ必要がある)
クリックします。
image.png

メニューが開くので、実行を選びましょう。
image.png

まず、ビルドが実行されます。一番下のビルドタブが自動的に開きます。
image.png

ビルドが正常終了すると、今度は実行タブが自動的に開きます。
Spring のアスキーアートが表示された後に、Tomcat が Port 8080 で起動し、最後に FirstSpringWebAppApplication が開始されたことがログからわかります。
image.png

ブラウザで http://localhot:8080 へアクセスします。
image.png

いいですね。

Azure Toolkit for IntelliJ をセットアップ

Azure App Service へデプロイするには 様々な方法があります。Maven のプラグインを使う方法を一番見かける気がしますが、Azure の情報をpom.xml に設定する(される)必要があるため、私の好みではありません。チーム開発や本番運用後にどうするかはさておき、とりあえずデプロイして動きを確認したい場合は プラグインを使ってデプロイするのが一番簡単です。

IntelliJ IDEA から直接 Azure へデプロイするには Azure Toolkit for IntelliJ というプラグインをインストールします。

ファイル->設定をクリックします。
image.png

Marketplace にて Azure Toolkit for IntelliJ プラグインをインストールします。この図は既にインストール済みの状態です。Marketplace タブをクリックして Azure で検索するとすぐにヒットするはずです。

image.png

Azure App Service(WebApps)へデプロイ

ではデプロイしてみます。IntelliJ IDEA の一番左に Azure Explorer が見えていたらそれをクリックしてウィンドウを表示します。もし左に見えていなかったら表示 -> ツールウィンドウ-> Azure Explorer をクリックします。

image.png

Azure へログインする

初回はAzureにサインインします。

image.png

ログインの方法がいくつか選択できます。Azure CLI を使っている場合は簡単です。選ぶだけで勝手にログインします。
もし使っていなかったら Device Login を選ぶといいでしょう。

image.png

ログインに成功すると、アカウントに紐づくサブスクリプションを選択できるようになります。予め作っておいた App Service が存在するサブスクリプションを選択します。

image.png

デプロイする

ここまで来たらもう Azure Explorer に用はありません。IntelliJ IDEA 画面の一番左、プロジェクトをクリックしてディレクトリ階層を再び表示させます。

プロジェクトの一番上のディレクトリを右クリックすると、メニューの一番下のあたりに Azure というメニューが追加されています。その中に Deploy to Azure Web Apps があるはずです。クリックしましょう。

image.png

デプロイする先を選択するダイアログが表示されます。予め作っておいた App Service を選択したら、実行ボタンをクリックします。

image.png

まずビルドが走ります。画面一番下の実行ウィンドウがアクティブになります。

image.png

ビルドが終わると、同じ実行ウィンドウ内で別タブが開いてデプロイプロセスが開始されることがわかります。

image.png

ブラウザで URL を開くと、デプロイされたことが確認できます。
image.png
いいですね。

デプロイすると、実行構成に今デプロイした構成が追加され、選択状態になります。
image.png

このままだと実行ボタンクリックで毎回デプロイしてしまうので、ローカル実行構成に戻しましょう。(上図だったら FirstSpringWebAppApplication がローカル実行の構成)

どこにどうデプロイされた?

App Service on Linux は SSH で接続することができます。既定でドキュメントルートは ~/site/wwwroot なので覗いてみましょう。

image.png

app.jar としてデプロイされていますね。

まとめ・感想

プラグインを入れれば、クリック数回でデプロイできてしまいます。本当に簡単ですね。ぶっちゃけ C# の ASP.NET Core アプリを Visual Studio からデプロイするより簡単です。Spring Boot アプリを Azure App Service で試しにホスティングする時には是非使いましょう。

1
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
1
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?