基本編

アジェンダ はじめに

階層構造

Repositoryの実装

Serviceの実装

Controllerの実装

まとめ

はじめに Spring Bootを使って、

実際に簡単なWebページを作成する。

階層構造 下記の階層構造でシステムを構築する

Controller

ブラウザ

Service

Repository

Database

Template Model

Entity

Entity

Entity

Entity

Model １．入力値を受け取る

２．ビジネスロジックを書く

３．データの取得・更新をする ４．データを返す

５．データを返す

６．HTMLに変換

実際に下の階層から 実装してみる

Repositoryの実装 Serviceから処理要求を受け取り、

Databaseに対してデータの取得・更新を行う

Service

Repository

Database

Entity Entity

３．データの取得・更新をする ４．データを返す

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を作成

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であるべき。

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 );

Repositoryの実装 ただのクラスをRepositoryに仕立てる

/** productテーブルのRepository */ public interface ProductRepository extends JpaRepository <Product, Integer> { }

JpaRepositoryを拡張した インターフェースであることを明記 「product」テーブルの

Repositoryであることを明記

PKはInteger（数値フィールド） であることを明記

JpaRepositoryには基本的なデータベース操作は宣言されていて、 カスタマイズの必要がなければ特に中身のないインターフェース宣言で良い（そんなケースは稀な気が・・・）

Serviceの実装 Controllerから処理要求を受け取り、

Repositoryに対してデータの取得・更新を行う

Controller

Service

Repository

Entity

Entity

Entity

Entity

２．ビジネスロジックを書く ５．データを返す

Serviceの実装 商品関連のビジネスロジックを実行するServiceを作成

package sample.springbootweb.service.product; /** 商品関連のビジネスロジックを実行するService */ public class ProductService { }

「service」パッケージに 商品関連のパッケージ「product」を作成

Serviceの実装 ただのクラスをServiceに仕立てる

/** 商品関連のビジネスロジックを実行するService */ @Service public class ProductService { }

クラス宣言に@Serviceを付けて、 Serviceであることを明記

Serviceの実装 Repositoryを呼び出す

/** 商品関連のビジネスロジックを実行するService */ @Service public class ProductService { @Autowired ProductRepository productRepository; /** 商品一覧を返す */ public List<Product> getProductList() { List<Product> list = productRepository.findAll(); return list; } }

使用するRepositoryを宣言

Repositoryのメソッドを 呼び出してデータを取得

取得したデータを返却

Controllerの実装 ブラウザからの入力値を受け取り、

Serviceへ処理要求を出し、 結果をテンプレートに渡してHTMLをレンダリングさせる

Controller

ブラウザ

Service

Template Model

Entity Entity

Model １．入力値を受け取る

６．HTMLに変換

Controllerの実装 商品関連のページを制御するControllerを作成

package sample.springbootweb.app.product; /** 商品関連のページを制御するController */ public class ProductController { }

「app」パッケージに 商品関連のパッケージ「product」を作成

Controllerの実装 ただのクラスをControllerに仕立てる

/** 商品関連のページを制御するController */ @Controller @RequestMapping("product") public class ProductController { }

クラス宣言に@Controllerを 付けて、Controllerであることを明記

URL「product」に対する Controllerとして関連付ける

http://someserver/someapp/product/

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」を 表示する

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を宣言

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に詰める

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

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をブラウザで開いて見た目の確認をする （デザイナーさんの仕事）

Controllerの実装 テンプレートを作成する

HTMLをブラウザで開いてみる

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の要素を出力する

Controllerの実装 実行する

Webサーバにアクセスする http://localhost:8080/product/

まとめ 各階層に応じた役割を意識し実装する

Repository → データベース操作 Service → ビジネスロジックの実装 Controller → 画面制御

テンプレートはエンジニアは触らずデザイナーに任せる

入力値チェック、セッション管理、トランザクション制御 ・・・などなど、まだ触れていないことは色々