簡易書籍登録アプリケーション作成（JPA版）
6.5 簡易書籍登録アプリケーション作成（JPA版）
6.5.1 アプリケーション概要
1 アプリケーション作成の目的
6.4で作成したプロジェクトをもとに、JPAを利用した簡単なデータ登録方法を学習していきます。
2 簡易書籍登録アプリケーション（JPA版）プロジェクト構成(完成状態)
6.5.2 コントローラークラスの修正
1 「BmsController」クラスファイルに以下に示すソースコードを追記する。
■ソースコード
【ファイル名：BmsController.java】
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;
}
}
図 6.5 1：プロジェクト準備完了
6.5.3 テンプレートファイルの作成
1 「templates」フォルダ内に「insert.html」を作成
2 1で作成した「insert.html」ファイルに以下に示すソースコードを記述する。
■ソースコード
【ファイル名：insert.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© 2025 All Rights Reserved.</h4>
</div>
</footer>
</div>
</body>
</html>
6.5.4 アプリケーションの実行
1 XAMPP（MariaDB）の起動
2 アプリケーションの実行
3 アプリケーションにアクセス（書籍一覧画面）
以下のアドレスから簡易書籍一覧表示アプリケーションにアクセスします。
URL：http://localhost:8080/insert
図 6.5 2：アプリケーションアクセス画面（書籍登録画面で入力後、登録ボタンクリック）
図 6.5 3：アプリケーションアクセス画面（書籍一覧画面に遷移し、データが追加されている）