簡易書籍登録アプリケーション作成(JPA版)

6.5 簡易書籍登録アプリケーション作成(JPA版)

6.5.1 アプリケーション概要

1 アプリケーション作成の目的
6.4で作成したプロジェクトをもとに、JPAを利用した簡単なデータ登録方法を学習していきます。
2 簡易書籍登録アプリケーション(JPA版)プロジェクト構成(完成状態)

6.5.2 コントローラークラスの修正

1 「BmsController」クラスファイルに以下に示すソースコードを追記する。

■ソースコード
【ファイル名:BmsController.java】

[html] package jp.co.f1.spring.bms.controller; import org.springframework.stereotype.Controller; import org.springframework.web.bind.annotation.GetMapping; import org.springframework.web.bind.annotation.PostMapping; import org.springframework.web.bind.annotation.ModelAttribute; import org.springframework.web.servlet.ModelAndView; import org.springframework.beans.factory.annotation.Autowired; import jp.co.f1.spring.bms.repository.BookRepository; import jp.co.f1.spring.bms.entity.Book; @Controller public class BmsController { // Repositoryインターフェースを自動インスタンス化 @Autowired private BookRepository bookinfo; /* * 「/list」へアクセスがあった場合 */ @GetMapping(“/list”) public ModelAndView list(ModelAndView mav) { // bookinfoテーブルから全件取得 Iterable<Book> book_list = bookinfo.findAll(); // Viewに渡す変数をModelに格納 mav.addObject(“book_list”, book_list); // 画面に出力するViewを指定 mav.setViewName(“list”); // ModelとView情報を返す return mav; } /* * 「/insert」へアクセスがあった場合 */ @GetMapping(“/insert”) public ModelAndView insert(ModelAndView mav) { // 画面に出力するViewを指定 mav.setViewName(“insert”); // ModelとView情報を返す return mav; } /* * 「/insert」へPOST送信された場合 */ @PostMapping(value = “/insert”) // POSTデータをBookインスタンスとして受け取る public ModelAndView insertPost(@ModelAttribute Book book, ModelAndView mav) { // 入力されたデータをDBに保存 bookinfo.saveAndFlush(book); // リダイレクト先を指定 mav = new ModelAndView(“redirect:/list”); // ModelとView情報を返す return mav; } } [/html]

図 6.5 1:プロジェクト準備完了

6.5.3 テンプレートファイルの作成

1 「templates」フォルダ内に「insert.html」を作成
2 1で作成した「insert.html」ファイルに以下に示すソースコードを記述する。

■ソースコード
【ファイル名:insert.html】

[html] <!DOCTYPE html> <html> <head> <meta charset=”UTF-8″> <title>書籍登録</title> <link rel=”stylesheet” th:href=”@{/css/style.css}”> </head> <body> <!– ブラウザ全体 –> <div id=”wrap”> <!– ヘッダー部分 –> <header> <div class=”container”> <h1>書籍管理システムSpring版 Ver.0.5</h1> </div> </header> <!– メニュー部分 –> <div id=”menu”> <div class=”container”> <!– ナビゲーション –> <div id=”nav”> <ul> <li><a href=”#”>[メニュー]</a></li> <li><a href=”/list”>[書籍一覧]</a></li> </ul> </div> <!– ページタイトル –> <div id=”page_title”> <h2>書籍登録</h2> </div> </div> </div> <!– 書籍登録コンテンツ部分 –> <div id=”main” class=”container”> <!– 入力フォーム –> <form action=”/insert” method=”POST”> <table class=”input-table” align=”center”> <tr> <th>ISBN</th> <td> <input type=”text” name=”isbn”> </td> </tr> <tr> <th>TITLE</th> <td> <input type=”text” name=”title”> </td> </tr> <tr> <th>価格</th> <td> <input type=”text” name=”price”> </td> </tr> </table> <input type=”submit” value=”登録”> </form> </div> <!– フッター部分 –> <footer> <div class=”container”> <h4>Copyright&copy; 2025 All Rights Reserved.</h4> </div> </footer> </div> </body> </html> [/html]

6.5.4 アプリケーションの実行

1 XAMPP(MariaDB)の起動
2 アプリケーションの実行
3 アプリケーションにアクセス(書籍一覧画面)
以下のアドレスから簡易書籍一覧表示アプリケーションにアクセスします。
URL:http://localhost:8080/insert

図 6.5 2:アプリケーションアクセス画面(書籍登録画面で入力後、登録ボタンクリック)

図 6.5 3:アプリケーションアクセス画面(書籍一覧画面に遷移し、データが追加されている)


NEXT>> 6.6 簡易書籍登録アプリケーションの説明(JPA版)