Spring BootでシンプルなWebアプリケーションを開発する環境構築手順について

はじめに

これはJavaやSpring Bootの学習をするために動かせるプロジェクトを作成したいけど、そのための環境構築やプロジェクト作成方法がわからない方向けの記事です。 記事の前半で開発環境の構築手順、後半でWebアプリケーションのプロジェクト作成と実行までを説明しています。 作成するプロジェクトは"Hello World"を表示するだけのシンプルなWebアプリケーションですが、これをベースにいろいろと手を入れながら学習できると思います。

開発環境の構築手順

開発環境について

この記事の説明で利用するPCはWindows 10です。Macユーザの方は適宜読み替えてください。

• Windows 10
• OpenJDK 13.0.2
• Eclipse 2019-12
• Spring Boot 2.2.5

Java

Javaは、OpenJDK 13.0.2を使用します。（2020/3月時点の最新バージョンです）

インストール

OpenJDKのインストールは、一般的なソフトウェアやOracle JDKのインストールとは違って、zipファイルをダウンロードしそれを展開して配置するだけで済みます。 まず、zipファイルをダウンロードするためhttp://jdk.java.net/13/にアクセスします。 Fig1の赤い枠線で囲ったリンクをクリックするとzipファイルのダウンロードがはじまります。

Fig1. OpenJDKのダウンロード

ダウンロードが完了したら、7-Zipなどzipファイルを展開するツールを使って任意のフォルダへzipファイルを展開します。 この記事では下記の場所へ展開しましたので、この場所をOpenJDKのインストールフォルダとして説明を続けます。

C:\dev\openjdk\jdk-13.0.2

念のため、Windowsエクスプローラでこの場所に下記のフォルダやファイルがあることを確認します。

Fig2. OpenJDKのフォルダ内容

バージョンの確認

コマンドプロンプトを起動し、下記のコマンドを実行してOpenJDKのバージョンを確認します。

C:\dev\openjdk\jdk-13.0.2\bin\java -version

以下の実行結果が返ってくれば成功です。

openjdk version "13.0.2" 2020-01-14
OpenJDK Runtime Environment (build 13.0.2+8)
OpenJDK 64-Bit Server VM (build 13.0.2+8, mixed mode, sharing)

環境変数pathの設定

javaコマンドを毎回フルパス（絶対パス）で入力しなくても済むように、環境変数pathにjavaコマンドのフルパスを追加します。 Windowsのスタートメニューを開き（キーボードのWinキーを押下でも可）、そのままenvと入力します。 Fig3のような画面が表示されたら、赤い枠線で囲った”開く"をクリックします。

Fig3. システム環境変数の編集

Fig4の”環境変数(N)"ボタンをクリックします。

Fig4. システムプロパティ画面

Fig5のようにJAVA_HOMEというシステム変数の変数値にOpenJDKのインストールディレクトリを登録します。

Fig5. JAVA_HOMEの追加

最後にFig6のように環境変数pathに%JAVA_HOME%\binという値を追加します。

Fig6. 環境変数pathの編集

環境変数pathが正しく設定されたかどうか確認するため、コマンドプロンプトを新しく開き以下のコマンドでバージョンを確認します。 バージョン情報が返ってきたら成功です。

java -version

Eclipse

Webアプリケーションの開発ツールにEclipseを使用します。開発ツールにはEclipse以外にもIntelliJ IDEAやNetBeans、Spring Tools Suiteなどがあります。また日本語化されていて便利な拡張機能がプレインストールされているPleiades All in Oneも人気があります。

インストール

EclipseのインストールもOpenJDKと同様にzipファイルをダウンロードして展開するだけで済みます。 ダウンロードページにアクセスするとFig7のページが表示されますが、ここのダウンロードボタンではなく赤い枠線で囲った"Download Packages"というリンクをクリックします。

Fig7. Eclipseのダウンロードページ

この画面(Fig8)の"Windows 64-bit"のリンクをクリック、次の画面(Fig9)のファイル名をクリックするとzipファイルのダウンロードが始まります。

Fig8. Windows 64-bit

Fig9. ダウンロードリンク

ダウンロードしたzipファイルを7-Zipなどのツールで展開します。 この記事では下記の場所へ展開しましたので、この場所をEclipseのインストールフォルダとして説明を続けます。

C:\dev\eclipse

Windowsエクスプローラで、この場所に下記のフォルダやファイルがあることを確認します。

Fig10. Eclipseのフォルダ内容

eclipse.exeを右クリックしてメニューの「送る」→「デスクトップ（ショートカットを作成）」をクリックします。これでデスクトップにEclipseのショートカットアイコンが作成されました。

起動と設定

デスクトップに作成したEclipseのアイコンをクリックしてEclipseを起動します。 起動するとワークスペースの場所を決めるダイアログウィンドウが表示されます。ワークスペースの場所はどこでも構わないのですが、この記事ではEclipseをインストールしたフォルダと同じ場所にeclipse-workspaceというフォルダを作成しました。

Fig11. Eclipseのワークスペースの場所

C:\dev\eclipse-workspace

起動するとWelcome画面(Fig12)が表示されます。右下のチェックを外してWelcome画面を閉じます。（チェックを外さないと毎回Welcome画面が表示されます）

Fig12. Welcome画面

次にJAVA_HOMEの設定が正しく反映されているか確認します。 メニューバーのWindow → Preferencesをクリックし、左側メニューのJava → Installed JREsをクリックします。 画面右側のInstalled JREsにJAVA_HOMEで登録したOpenJDKが反映されていることを確認します。

Fig13. Installed JREsの確認

そのまま続けて、左側メニューのGeneral → Workspaceをクリックします。 画面右側のText file encodingをDefault (MS932)からOtherのUTF-8へ、New text file line delimiterをDefault (Windows)からOtherのUnixへ変更します。（この変更はプロジェクトをGitで管理する場合を想定しています。）

Fig14. Workspaceの設定

次に左側メニューのGeneral → Editors → Text Editorsをクリックします。 画面右側のShow whitespace charactersをチェックします。この設定を有効にすると目に見えない文字（半角スペースやタブ、改行）がエディタ上では代替文字で可視化されるようになります。

Fig15. Text Editorの設定

拡張機能のインストール

Spring Bootを使ったWebアプリケーションのプロジェクトを作成できるようにSpring Tools 4という拡張機能を追加します。 メニューバーのHelp → Eclipse Marketplace...をクリックし、Searchタブの検索フィールドにspring tools 4と入力して検索します。 画面(Fig16)に表示された"Spring Tools 4 (aka Spring Tool Suite 4) 4.5.1.RELEASE"のInstallボタンをクリックしてインストールを始めます。

Fig16. Spring Tools 4のインストール

確認画面(Fig17)で、そのままConfirmボタンをクリックします。

Fig17. Confirm画面

ライセンスの同意画面(Fig18)で、I accept the terms of the license agreementsにチェックを入れてライセンスに同意し、Finishボタンをクリックしてインストールを開始します。

Fig18. ライセンス同意画面

インストールが終わるとEclipseの再起動を促されるので、一旦再起動します。

以上で開発環境の構築は完了です。

プロジェクトの作成

Spring Bootを利用したWebアプリケーションのプロジェクトを簡単に作成する手段がいくつかありますが、主なものではSpring InitializrというWebサービスを利用する方法、もう1つはEclipse拡張機能のSpring Tools 4を利用する方法があります。 この記事では2つ目の方法、Spring Tools 4を使ってプロジェクトを作成します。

プロジェクトの作成開始

EclipseのメニューバーのFile → New → Other...をクリックします。 画面(Fig 19)のフィールドにspringと入力し、検索結果に表示されたSpring Starter Projectを選択して、Nextボタンをクリックします。

Fig19. Spring Starter Project

プロジェクトのアーキテクチャを選択

この画面(Fig 20)で、Java Versionを13へ変更します。Typeでプロジェクトのビルドツールを選択できますがデフォルトのMavenのままにします。

Fig20. Spring Boot Project

Spring Bootの依存ライブラリを選択

Spring Boot 2.2.5は、2020年3月現在の最新バージョンです。 画面左に利用できるライブラリの一覧がカテゴリ別に表示されています。 画面右に選択したライブラリの一覧が表示されます。（Fig21は最初の状態なので何も選択されていません）

Fig21. 依存ライブラリの選択

この記事で開発するWebアプリケーションは"Hello World"を表示するだけのシンプルなものなので、必要な依存ライブラリは以下の3つだけです。

• WebカテゴリのSpring Web
• Template EnginesカテゴリのThymeleaf
• Developer ToolsカテゴリのSpring Boot DevTools

Spring Webの追加

Fig22. Spring Webの追加

Thymeleafの追加

Fig23. Thymeleafの追加

Spring Boot DevToolsの追加

Fig24. Spring Boot DevTools

選択できる依存ライブラリはたくさんありますが、とりあえず必要なのは3だけなので選択できたら最後にFinishボタンをクリックしプロジェクトを作成します。 （※たとえば、データベースを扱いたい場合はSQLカテゴリの"Spring Data JPA"や"Spring Data JDBC"とデータベースドライバ(MySQL DriverやPostgreSQL Driver)を選択します。）

作成直後のプロジェクトの状態

プロジェクトの作成が完了すると、Project Explorerにプロジェクトが展開されます。

Fig25. 作成されたプロジェクト

プロジェクト内にDemoApplicationというクラスがありますが、これはSpring Tools 4が生成したクラスで、Spring Bootを利用したアプリケーションの起動クラスになります。

package com.example.demo;

import org.springframework.boot.SpringApplication;
import org.springframework.boot.autoconfigure.SpringBootApplication;

@SpringBootApplication
public class DemoApplication {

    public static void main(String[] args) {
        SpringApplication.run(DemoApplication.class, args);
    }

}

また、"src/main/resources"にapplication.propertiesというSpring Bootアプリケーションの設定ファイルが生成されていますが、プロジェクト作成直後はただの空ファイルです。 この記事でも特に設定を変える部分はないので編集しません。

Mavenでビルドする

とりあえず、プロジェクト作成直後の状態でビルドを行ってみます。 Project Explorer上のプロジェクト名を右クリックし、メニューのRun As → Maven buildをクリックします。

Fig26. Run Configurations

編集画面(Fig27)でGoalsにclean packageと入力し、Runボタンをクリックしてビルドを行います。（編集画面の設定は、この後でも行えます）

Fig27. Edit Configurations

ビルド結果がEclipseのConsoleに出力されます。Fig28のように"BUILD SUCCESS"と表示されればビルドは成功です。

Fig28. Build Success

ビルドが成功すると、targetフォルダにjarファイル（成果物／アーティファクト）が生成されています。 jarファイルが見えない場合は、Project Explorer上のプロジェクト名を選択した状態でF5キーを押下して画面をリフレッシュしてください。

Fig29. jarファイル

以降のMavenビルドは、プロジェクト名を右クリック → Run AS → Maven buildで行えます。

Hello Worldの実装

ここから、"Hello World"を表示するWebアプリケーションの開発手順について説明します。

controllerパッケージを追加する

com.example.demoというパッケージを右クリックし、メニューのNew → Packageをクリックします。

Fig30. create package

Fig31. create package

controllerクラスを追加する

作成したcom.example.demo.controllerパッケージを右クリックし、メニュ―のNew → Classをクリックします。

Fig32. create class

クラス名にHelloWorldControllerと入力します。

Fig33. create class

HelloWorldController

package com.example.demo.controller;

import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.GetMapping;

@Controller
public class HelloWorldController {

    @GetMapping(value = "/")
    public String index(Model model) {
        String message = "ハローワールド";
        model.addAttribute("message", message);
        return "hello-world";
    }

}

テンプレートファイルを追加する

templatesフォルダを右クリックし、メニューのNew → Other...をクリックします。

Fig34. create template file

入力フィールドに"html"と入力し、検索結果に表示されたHTML Fileを選択して、Nextボタンをクリックします。

Fig35. create template file

テンプレートファイル名にhello-world.htmlと入力します。

Fig36. create template file

hello-world.html

<!DOCTYPE html>
<html lang="ja" xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="UTF-8">
<title>Hello World</title>
</head>
<body>
    <div>
        <h1 th:text="${message}"></h1>
    </div>
</body>
</html>

アプリケーションの実行

アプリケーションの実行方法にもいくつか手段があります。

Eclipseから実行する

• 1つ目はDemoApplicationクラスを右クリックし、Run AS → Java Application もしくは Spring Boot Appをクリックする方法。
• 2つ目はプロジェクト名を右クリックし、Run AS → Spring Boot Appをクリックする方法。

アプリケーションを実行すると、EclipseのConsoleに起動メッセージが出力されます。 Consoleの最後の方に"Started DemoApplication in 1.918 seconds"のようなメッセージが表示されていればアプリケーションの起動は成功です。

2020-03-16 17:29:53.264  INFO 9184 --- [  restartedMain] o.s.b.d.a.OptionalLiveReloadServer       : LiveReload server is running on port 35729
2020-03-16 17:29:53.425  INFO 9184 --- [  restartedMain] o.s.b.w.embedded.tomcat.TomcatWebServer  : Tomcat started on port(s): 8080 (http) with context path ''
2020-03-16 17:29:53.429  INFO 9184 --- [  restartedMain] com.example.demo.DemoApplication         : Started DemoApplication in 1.918 seconds (JVM running for 2.803)

この方法でアプリケーションを実行すると、次からEclipseのメニューバーのRunアイコンから簡単に実行できます。

Fig37. run application

Mavenコマンドで実行する

3つ目はMavenコマンドで実行する方法です。コマンドプロンプトでプロジェクトディレクトリを開き、下記のコマンドを実行します。 この方法でもEclipseから起動したのと同じ起動メッセージが出力されます。

mvnw spring-boot:run

jarファイルを実行する

4つ目はビルドして生成したjarファイルを実行する方法です。 以下はプロジェクトディレクトリから実行する例になります。 1行目のコマンドでMavenビルドを実行してjarファイルを生成します。（jarファイルが生成されていればスキップしても構いません） 2行目のコマンドでjarファイルを実行します。

mvnw clean package
java -jar .\target\demo-0.0.1-SNAPSHOT.jar

上記の方法のいずれかでアプリケーションが起動したらブラウザを立ち上げ、以下のURLでアクセスします。画面に”ハローワールド”と表示されれば成功です。

http://localhost:8080/

環境構築手順とプロジェクトの作成方法の説明は以上です。