Spring bootを使ったウェブシステム構築の基本

1. 基本編

2. アジェンダ
 はじめに
 階層構造
 Repositoryの実装
 Serviceの実装
 Controllerの実装
 まとめ

3. はじめに
 Spring Bootを使って、
実際に簡単なWebページを作成する。

4. 階層構造
 下記の階層構造でシステムを構築する
Controller
ブラウザ
Service
Repository
Database
TemplateModel
Entity
Entity
Entity
Entity
Model１．入力値を受け取る
２．ビジネスロジックを書く
３．データの取得・更新をする ４．データを返す
５．データを返す
６．HTMLに変換
実際に下の階層から
実装してみる

5. Repositoryの実装
 Serviceから処理要求を受け取り、
Databaseに対してデータの取得・更新を行う
Service
Repository
Database
Entity Entity
３．データの取得・更新をする ４．データを返す

6. Repositoryの実装
 商品のデータ(productテーブル)を制御するRepositoryと
データの入れ物のEntityを作成
package sample.springbootweb.repository;
/** productテーブルのRepository */
public interface ProductRepository {
}
package sample.springbootweb.model;
/** productテーブルのEntity */
public class Product {
}
「repository」パッケージに
productテーブルの
Repositoryを作成
「model」パッケージに
productテーブルの
Entityを作成

7. Repositoryの実装
 ただのクラスをEntityに仕立てる
/** productテーブルのEntity */
@Entity
@Table(name="product")
public class Product {
/** 商品コード */
@Id
public Integer productCode;
/** 商品名 */
public String productName;
/** 価格 */
public Integer price;
}
クラス宣言に@Entityを付けて、
Entityであることを明記
「product」テーブルの
Entityであることを明記
それぞれのカラムに対応した
フィールドを宣言
フィールド宣言に「@Id」を付けて、
このフィールドがPKであることを明記
※便宜上、フィールドをpublic宣言している。
本来、フィールドはprivateであるべき。

8. Repositoryの実装
 Productテーブルとサンプルデータ
-- DDL
create table product (
product_code int(5),
product_name varchar(50),
price int(10),
primary key ( product_code )
);
--DML
insert into product values( 1, 'ガム', 100 );
insert into product values( 2, 'アメ', 120 );
insert into product values( 3, 'チョコ', 150 );

9. Repositoryの実装
 ただのクラスをRepositoryに仕立てる
/** productテーブルのRepository */
public interface ProductRepository
extends JpaRepository <Product, Integer> {
}
JpaRepositoryを拡張した
インターフェースであることを明記 「product」テーブルの
Repositoryであることを明記
PKはInteger（数値フィールド）
であることを明記
JpaRepositoryには基本的なデータベース操作は宣言されていて、
カスタマイズの必要がなければ特に中身のないインターフェース宣言で良い（そんなケースは稀な気が・・・）

10. Serviceの実装
 Controllerから処理要求を受け取り、
Repositoryに対してデータの取得・更新を行う
Controller
Service
Repository
Entity
Entity
Entity
Entity
２．ビジネスロジックを書く ５．データを返す

11. Serviceの実装
 商品関連のビジネスロジックを実行するServiceを作成
package sample.springbootweb.service.product;
/** 商品関連のビジネスロジックを実行するService */
public class ProductService {
}
「service」パッケージに
商品関連のパッケージ
「product」を作成

12. Serviceの実装
 ただのクラスをServiceに仕立てる
/** 商品関連のビジネスロジックを実行するService */
@Service
public class ProductService {
}
クラス宣言に@Serviceを付けて、
Serviceであることを明記

13. Serviceの実装
 Repositoryを呼び出す
/** 商品関連のビジネスロジックを実行するService */
@Service
public class ProductService {
@Autowired
ProductRepository productRepository;
/** 商品一覧を返す */
public List<Product> getProductList() {
List<Product> list = productRepository.findAll();
return list;
}
}
使用するRepositoryを宣言
Repositoryのメソッドを
呼び出してデータを取得
取得したデータを返却

14. Controllerの実装
 ブラウザからの入力値を受け取り、
Serviceへ処理要求を出し、
結果をテンプレートに渡してHTMLをレンダリングさせる
Controller
ブラウザ
Service
TemplateModel
Entity Entity
Model１．入力値を受け取る
６．HTMLに変換

15. Controllerの実装
 商品関連のページを制御するControllerを作成
package sample.springbootweb.app.product;
/** 商品関連のページを制御するController */
public class ProductController {
}
「app」パッケージに
商品関連のパッケージ
「product」を作成

16. Controllerの実装
 ただのクラスをControllerに仕立てる
/** 商品関連のページを制御するController */
@Controller
@RequestMapping("product")
public class ProductController {
}
クラス宣言に@Controllerを
付けて、Controllerであることを明記
URL「product」に対する
Controllerとして関連付ける
http://someserver/someapp/product/

17. Controllerの実装
 リクエストとメソッドを関連付ける
/** 商品関連のページを制御するController */
@Controller
@RequestMapping("product")
public class ProductController {
/** 商品一覧を表示する */
@RequestMapping(value = "/", method=RequestMethod.GET)
public String list() {
return "product/list“;
}
}
value値でURL「product」の
ルート（/） Controllerとして関連付ける
method値でHTTPメソッド「GET」に
関連付ける
テンプレート「product/list.html」を
表示する

18. Controllerの実装
 Serviceを呼び出す
/** 商品関連のページを制御するController */
@Controller
@RequestMapping("product")
public class ProductController {
@Autowired
private ProductService productService;
/** 商品一覧を表示する */
@RequestMapping(value = "/", method=RequestMethod.GET)
public String list() {
return "product/list";
}
}
使用するServiceを宣言

19. Controllerの実装
 Serviceを呼び出す
/** 商品関連のページを制御するController */
@Controller
@RequestMapping("product")
public class ProductController {
@Autowired
private ProductService productService;
/** 商品一覧を表示する */
@RequestMapping(value = "/", method=RequestMethod.GET)
public String list(Model model) {
List<Product> list = productService.getProductList();
model.addAttribute("productList", list);
return "product/list";
}
}
引数にModelを受け取る
（ControllerとTemplateの架け橋）
Serviceを呼び出す
Serviceの実行結果を
Modelに詰める

20. Controllerの実装
 TemplateのHTMLを記述する
<!DOCTYPE HTML>
<html xmlns:th="http://www.thymeleaf.org">
<head>
<title>商品一覧</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
</head>
<body>
商品一覧
</body>
</html>
テンプレートエンジン「Thymeleaf」で
使用するネームスペースの宣言
src¥main¥resources¥templates¥product¥list.html

21. Controllerの実装
 テンプレートを作成する
<body>
商品一覧
<table border="1">
<tr>
<th style="background-color:#CCCCCC">Code</th>
<th style="background-color:#CCCCCC">商品名</th>
<th style="background-color:#CCCCCC">金額</th>
</tr>
<tr>
<td>1</td>
<td>ダミー商品</td>
<td>50</td>
</tr>
</table>
</body>
素のHTMLで見た目の確認をする
HTMLをブラウザで開いて見た目の確認をする （デザイナーさんの仕事）

22. Controllerの実装
 テンプレートを作成する
HTMLをブラウザで開いてみる

23. Controllerの実装
 動的部分を作成する
<body>
商品一覧
<table border="1">
<tr>
<th style="background-color:#CCCCCC">Code</th>
<th style="background-color:#CCCCCC">商品名</th>
<th style="background-color:#CCCCCC">金額</th>
</tr>
<tr th:each="product: ${productList}">
<td th:text="${product.productCode}">1</td>
<td th:text="${product.productName}">ダミー商品</td>
<td th:text="${product.price}">50</td>
</tr>
</table>
</body>
Modelに詰めたproductListを取り出し、
for-eachでループさせる
Thymeleafで動的部分を実装する （エンジニアさんの仕事）
必要なEntityの要素を出力する

24. Controllerの実装
 実行する
Webサーバにアクセスする
http://localhost:8080/product/

25. まとめ
 各階層に応じた役割を意識し実装する
Repository → データベース操作
Service → ビジネスロジックの実装
Controller → 画面制御
 テンプレートはエンジニアは触らずデザイナーに任せる
 入力値チェック、セッション管理、トランザクション制御
・・・などなど、まだ触れていないことは色々