概要
※こちらの記事はSpring Boot でWebアプリを開発してみよう Vol.1【開発環境構築編】の続きの記事となっています。
今回は、Spring Bootでプロジェクトを作成する手順を解説していきます。プロジェクトとは、Javaのプログラムをひとつのアプリケーションとしてまとめたもののことを指します。Spring Bootのプロジェクトを作成する手順はいくつかありますが、今回はEclipseからウィザード形式でプロジェクトを作成していく方法を解説していきます。
今回のゴール
今回はローカル環境でブラウザに HelloWorld! を表示させるところを目標とします。
環境
Windows10
手順
プロジェクトを作成する
まずは新しくSpring Bootのプロジェクトを作成してみましょう。
- Eclipseを立ち上げる
- 左上の「ファイル」タブ > 「新規」 > 「プロジェクト」をクリック
- 「Spring Boot」 > 「Spring スターター・プロジェクト」を選択し、「次へ」をクリック
- 下記画像のように項目を入力し、「次へ」をクリック
入力した値を少しだけ解説します。
名前：作成するアプリケーション名を入力します。
型：ビルドツールを指定します。Javaのプログラムを動かすためにはコンパイルという作業が必要ですが、そういった作業をまとめて行ってくれるツールのことを指します。今回はGradleを使用します。
グループ：プロジェクトを一意に識別する名称です。
成果物：プロジェクトの成果物の名前。作成する JAR や WAR ファイルなどの名前に使用されます。
「使用可能」欄に値を入力して検索し、下記画像右の赤枠内のライブラリを選択して「完了」ボタンをクリック
この段階で選択されたライブラリは初めから同梱された状態でプロジェクトが作成されます。ライブラリは後から追加することもできますので、プロジェクト作成の時点で必要とわかっているライブラリのみ選択しておきましょう。
- Spring Web：SpringCore、SpringMVC、組み込みTomcat、ログライブラリ等をクラスパスに追加してくれる。Webアプリケーションを作成する際は導入を勧めます。
- Thymeleaf：テンプレートエンジン。
- H2 Database：インメモリのデータベース。
- Spring Boot DevTools：主にホットデプロイができるようになる。
6.「Sample」というアプリケーションができていれば成功です！
アプリケーションを実行する
続いて、作成したプロジェクトのアプリケーションを実行してみます。
- 「ウィンドウ」タブ > 「ビューの表示」 > 「その他」をクリック
2.「その他」 > 「Boot ダッシュボード」を選択し、「開く」をクリック
３. Bootダッシュボードのタブが表示されていることを確認します（表示される位置は環境によって変わりますが、デフォルトは下部に表示されることが多いです）
4.「local」 > 「Sample」を選択し、開始ボタンをクリック
5.コンソールでSpring Bootが起動して処理が流れていきます。最後に「Started SampleApplication」と表示されていれば成功です。
MVCモデルを理解する
ブラウザに「HelloWorld!」を表示する前に、まずはこれから作成するアプリケーションの構成のベースとなるMVCモデルについて軽く説明していきます。
MVCモデルとは、全体の処理をModel、View、Controllerの3つに分割し、それぞれに役割を持たせる構成のことを指します。
Model：アプリケーションが使用するデータや、DBに対する処理などを担当します。
View：クライアントからの入力やクライアントへの出力を担います。先ほど導入したThymeleafはこの部分を担うライブラリです。
- Controller：上記2つの橋渡しを担います。クライアントからの入力を View から受け取り、それをもとに Model に指示を伝えます。その後、Model から受け取った値を View に伝え、見た目に反映させます。
今回は「HelloWorld!」という文字列を表示するだけなのでController部分のファイルとView部分のファイルだけ作成すれば実現することができます。データを扱う処理やデータベースとの連携をしたい時にModel部分のファイルの作成が必要になります。
ブラウザに「HelloWorld!」を表示する
では、ブラウザに「HelloWorld!」を表示してみましょう。
Controllerファイルを作成する
まずはControllerファイルを作成していきます。
2.「名前」に任意のファイル名を記入します。今回は「HelloWorldController」と記入し、「完了」ボタンをクリック
3.「パッケージ・エクスプローラー」に「HelloWorldController.java」ファイルが作成され、開くと画像右の赤枠のようになっていることを確認します。
4.下記のようにコードを書いていきます。
```java package com.example.demo;
import org.springframework.stereotype.Controller; import org.springframework.web.bind.annotation.GetMapping;
@Controller //① public class HelloWorldController { //② @GetMapping("/") //③ public String helloWorld() { //④ return "HelloWorld"; //⑤ } } ```
初めなので少し詳しく解説します。
①：
@Controllerをつけることで②のClassがクライアントからのアクセスを受け取ることができるようになります。Javaでは、@～と記述することをアノテーションと呼びます。②：
HelloWorldControllerというClassを作成③：
@GetMapping("/")とすると、httpメソッドがGETリクエストでURLが/のアクセスがあると、④のメソッドが呼ばれるようになります。()の中のパスは、
http://localhost:8080に続く内容を表す。例えば
@GetMapping("/users")だとhttp://localhost:8080/usersのURLにアクセスがあると呼び出される。
④：
helloWorldというメソッドを作成⑤：
src/main/resources/templates/配下のHelloWorld.htmlをクライアント側に返す
これでControllerファイルの作成とコードの記入は完了です。
Viewファイルを作成する
続いて、Viewファイルを作成していきます。
- 左の「パッケージ・エクスプローラー」 > 「Sample」 > 「src/main/resources」 > 「templetes」を選択し、右クリック → 「新規」 > 「ファイル」をクリック
2.「ファイル名」に任意のファイル名を記入します。今回は「HelloWorld.html」と記入し、「完了」ボタンをクリック
3.「パッケージ・エクスプローラー」に「HelloWorld.html」ファイルが作成され、開くと画像右の赤枠のようになっていることを確認します。
4.下記のようにコードを書いていきます。
HTMLの記述なので詳しい説明は省きますが、これで「HelloWorld!」を表示するという記述になります。
これでViewファイルの作成とコードの記入も完了しました。
動作確認
- http://localhost:8080/ にアクセスし、以下のように表示されれば成功です！
終わりに
今回はSpring Bootのプロジェクト作成を解説していきました。
次回はEclipseとデータベースを連携して、データを扱えるようにしていきましょう！
