概要

業務でMyBatisを使用することがあったので理解度向上のために自宅でも色々触ってみる
下記のような操作が可能なアプリを作成する

ソースコード

Springの起動準備

プロジェクト作成
コントローラの作成
ビューの作成

プロジェクト作成

項目	値
Project Type	Gradle
Springバージョン	3.4.0
プロジェクト名	mybatis
Javaバージョン	17
Spring依存関係	Spring Web Spring Boot DevTools MyBatis Framework Thymeleaf Lombok H2 Database

build.gradle

※執筆時点では少しいじってしまっていたので少し異なるかもしれないけどだいたいこんな感じ

build.gradle

plugins {
	id 'java'
	id 'org.springframework.boot' version '3.4.0'
	id 'io.spring.dependency-management' version '1.1.6'
}

group = 'com.example'
version = '0.0.1-SNAPSHOT'

java {
	toolchain {
		languageVersion = JavaLanguageVersion.of(17)
	}
}

configurations {
	compileOnly {
		extendsFrom annotationProcessor
	}
}

repositories {
	mavenCentral()
}

dependencies {
	implementation 'org.springframework.boot:spring-boot-starter-thymeleaf'
	implementation 'org.springframework.boot:spring-boot-starter-web'
	implementation 'org.mybatis.spring.boot:mybatis-spring-boot-starter:3.0.4'
	runtimeOnly 'com.h2database:h2'
	compileOnly 'org.projectlombok:lombok'
	developmentOnly 'org.springframework.boot:spring-boot-devtools'
	annotationProcessor 'org.projectlombok:lombok'
	testImplementation 'org.springframework.boot:spring-boot-starter-test'
	testImplementation 'org.mybatis.spring.boot:mybatis-spring-boot-starter-test:3.0.4'
}

コントローラの作成

src/main/java/com/example/mybatis配下にcontrollerパッケージを作成
MybatisControllerクラスを作成

MybatisController.java

package com.example.mybatis.controller;

import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.GetMapping;

@Controller
public class MybatisController {

    @GetMapping("/mybatis")
    public String allUsers() {
        return "index";
    }
}

コントローラのため@Controllerを付与
@Getmappingによりlocalhost:8080/mybatisへアクセスした際にallUsersメソッドを呼び出し、index.htmlを呼び出すよう指定

ビューの作成

ビューとなるHTMLを、src/main/resources/template配下にindex.htmlを作成

index.html

<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>MyBatis学習ページ</title>
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha3/dist/css/bootstrap.min.css">
</head>
<body>
    <h1>MyBatis学習ページ</h1>
    <p>これから学習していきます</p>
</body>
</html>

htmlタグでThymeleafをインポート
いったん画面表示できることを確認するため仮でメッセージを用意

application.yml

prefixでThymeleafを使用するHTMLが格納されているディレクトリを指定

application.yml

spring:
  application:
    name: mybatis
  thymeleaf:
    prefix: file:src/main/resources/templates/

拡張子は.propertiesでも.ymlでもどちらでも問題ないため好みでOK

動作確認

Springを起動しlocalhost:8080/mybatisへアクセスすると下記の通りメッセージが表示されることを確認

データベースの用意

今回はJVM内で起動するインメモリデータベースであるH2 Databaseを使用

テーブル作成

src/main/resources配下にschema.sqlを作成し今回使用するテーブルを作成するDDLを記述
ユーザIDは自動採番としたいためAUTO_INCREMENTを指定
- 筆者の環境だとなぜかAUTO_INCREMENTの部分でエラーが出てしまっているが問題なく起動できるため無視
- 原因わかる方いたらコメントいただけると助かります。。。

schema.sql

CREATE TABLE USERS(
    id INT AUTO_INCREMENT PRIMARY KEY,
    username VARCHAR(50) NOT NULL,
    age INT,
    address VARCHAR(50)
);

データ準備

src/main/resources配下にdata.sqlを作成し、上記で作成したテーブルにデータを追加
IDは自動採番のため指定しない

data.sql

INSERT INTO USERS(username, age, address) VALUES('John', 18, 'America');
INSERT INTO USERS(username, age, address) VALUES('Pole', 20, 'Itary');
INSERT INTO USERS(username, age, address) VALUES('Daisuke', 25, 'Japan');
INSERT INTO USERS(username, age, address) VALUES('Mike', 17, 'Canada');

application.yml

application.yml内にデータベース関連の記述を追記

application.yml

  datasource:
    driver-class-name: org.h2.Driver
    url: jdbc:h2:mem:users;DB_CLOSE_ON_EXIT=TRUE
    username: yamashun
    password:
    initialization-mode: always
  h2:
    console:
      enabled: true

driver-class-nameでH2データベースを使用することを宣言
jdbc:h2:mem:<テーブル名>で今回使用するテーブル名を指定
usernameは任意の値を指定
passwordも任意の値を指定
initialization-modeをalwaysとすることでアプリケーション開始時にデータベースの初期化を実施
consoleをTRUEとすることでH2データベースのコンソール(localhost:8080/h2-console)の使用が可能になる

動作確認

Springを起動しlocalhost:8080/h2-consoleへアクセスすると下記の通りH2データベースのコンソール画面が表示されることを確認
Driver Class、JDBC URL、User Name、Passwordの4つの項目がapplication.ymlで指定した値になっていることを確認しConnectを押下

USERSを押下するとUSERSテーブルのデータを全件取得するクエリが表示されるため、Runを押下し実行
data.sqlで追加したデータが表示されることを確認

メイン画面の実装

ユーザの照会や登録、削除などの操作が可能なメイン画面をまずは実装する

コントローラ

MybatisController.java

    /**
     * メイン画面表示
     */
    @GetMapping("/main")
    public String mybatis() {

        return "main";
    }

localhost:8080/mainにアクセスするとmain.htmlを表示するよう設定

ビュー

main.html

<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">

<head>
    <meta charset="UTF-8">
    <title>メイン画面</title>
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha3/dist/css/bootstrap.min.css">
    <link rel="stylesheet" th:href="@{/css/style.css}">
</head>

<body>
    <div class="container mt-3">
        <h1>メイン画面</h1>
        <div class="d-flex flex-column align-items-start">
            <a th:href="@{/allUsers}" class="mb-2">ユーザ一覧</a>
            <a th:href="@{/userRegist}" class="mb-2">ユーザ登録</a>
            <a th:href="@{/userSearch}" class="mb-2">ユーザ検索</a>
            <a th:href="@{/userSearch}" class="mb-2">ユーザ情報変更</a>
            <a th:href="@{/userDelete}" class="mb-2">ユーザ削除</a>
        </div>
    </div>
</body>

</html>

Bootstrapで一部見た目を整えているが今回の学習内容とはあまり関係ないため割愛

メイン画面表示

Next