Spring Bootを使ったWebアプリケーションの基本~理解度チェック~


<h3>最初に</h3>
この記事は以下の内容が理解できているかを確認するためのものです。<BR>

1. <a href="https://qiita.com/homes31285/items/1ade4d469cad6170062d">Spring BootのWebアプリケーションの基本① ~IntelliJの使い方とMVCモデルの概要~</a><Br>
2. <a href="https://qiita.com/homes31285/items/4c034d62875922dbb0e0">Spring BootのWebアプリケーションの基本② 〜MVCモデルとEntityとlombok~</a><Br>
3. <a href="https://qiita.com/homes31285/items/8fa63b905ec807b7f714">Spring BootのWebアプリケーションの基本③~3層アーキテクチャと依存性の注入~</a><Br>
4. <a href="https://qiita.com/homes31285/items/70eee4f4a8cd3560d5d2">Spring BootのWebアプリケーションの基本④ ~データ・アクセス層とMyBatisとH2コンソール〜</a><Br>

<h3>Spring Bootを使ったWebアプリケーションの基本①の理解度チェック</h3>

<h3>MVCモデル</h3>

MVC（Model-View-Controller）モデルは、ウェブ開発で使用されるアーキテクチャパターンです。

アプリケーションをモデル、ビュー、コントローラの3つのコンポーネントに分割します。

<b>モデル</b>：データの処理を担当し、データベースとのやり取りを行います。
<b>ビュー</b>：ユーザーインターフェースを表現し、データの表示を担当します。
<b>コントローラ</b>：ユーザー入力を処理し、リクエストを受け取ってモデルとビューを更新します。

<h3>リクエストとレスポンス</h3>

Spring Bootでは、リクエストはControllerクラスで処理され、レスポンスが返されてブラウザに表示されます。(<a 
 href="https://qiita.com/homes31285/items/1ade4d469cad6170062d#%E3%83%AA%E3%82%AF%E3%82%A8%E3%82%B9%E3%83%88%E3%81%A8%E3%83%AC%E3%82%B9%E3%83%9D%E3%83%B3%E3%82%B9%E3%81%A8%E3%81%84%E3%81%86%E8%80%83%E3%81%88%E6%96%B9">こちらを参照</a>)

<h3>理解度チェック①</h3>
Spring Initializrを使ってプロジェクトを新規作成し、名前を以下の通りにしましょう。

![スクリーンショット 2023-08-22 20.00.37.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2782718/71b8f51d-f782-54d4-6662-7fabc6fc8a39.png)



ただし、バージョンの違いにより、期待結果にならない場合があるので、build.gradleは以下の通りに設定してください。

```gradle:build.gradle
plugins {
	id 'java'
	id 'org.springframework.boot' version '2.5.4'
	id 'io.spring.dependency-management' version '1.0.11.RELEASE'
}

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

java {
	sourceCompatibility = JavaVersion.VERSION_17
}

repositories {
	mavenCentral()
}

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

tasks.named('test') {
	useJUnitPlatform()
}
```

次に、「<a>http://localhost:8080」</a>にリクエストを出し、サーバが処理をしてレスポンスを返し、「```<h1>こんにちは</h1>```」とブラウザに表示するという処理のコードを作成してください。

<b>期待結果</b>

![スクリーンショット 2023-08-22 20.07.37.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2782718/909f82ef-d3d4-2fa2-8c38-0f8abbd2926a.png)


<h3>理解度チェック②</h3>
また、UIとロジックを分離する(<a href="https://qiita.com/homes31285/items/1ade4d469cad6170062d#%E3%83%86%E3%83%B3%E3%83%97%E3%83%AC%E3%83%BC%E3%83%88%E3%82%A8%E3%83%B3%E3%82%B8%E3%83%B3">こちらを参照</a>)
ために、Thymeleafを使用して、index.htmlとindexControllerの2つを作成してください。

<b>期待結果</b>
![スクリーンショット 2023-08-22 20.07.37.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2782718/909f82ef-d3d4-2fa2-8c38-0f8abbd2926a.png)

<h3>Spring Bootを使ったWebアプリケーションの基本②の理解度チェック</h3>

基本②では、MVCモデルを活用したWebアプリケーションの開発手法やEntityの設計、Thymeleafの利用、Controllerの役割、そしてLombokの活用方法を説明しました。

<h3>理解度チェック③</h3>

メンバ変数を以下の内容をTestEntityを作成します。

| データ型 | フィールド名 |
|:-:|:-:|
|  int |  testId |
|  String | summary  |

次に、test.htmlとTestController.javaを作成し、以下の下記の期待結果の内容を参考にコードを作成してください。

<b>期待結果</b>

![スクリーンショット 2023-08-22 20.54.21.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2782718/60acdf91-c9f4-b58c-263d-2edd4196db29.png)

<h3>Spring Bootを使ったWebアプリケーションの基本③の理解度チェック</h3>

Entityに関する処理に続いて、Webアプリケーションの3層アーキテクチャについて解説しました。
3層アーキテクチャのメリッやプレゼンテーション層・ビジネスロジック層・データ・アクセス層の役割について説明しています。

<h3>理解度チェック④</h3>

プレゼンテーション層とビジネスロジック層を分離させ、TestControllerとTestServiceのコードを作成してください。

<b>期待結果</b>

![スクリーンショット 2023-08-22 21.13.26.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2782718/607c7ebf-0bb9-961d-2955-691ba011d99a.png)

<h3>Spring Bootを使ったWebアプリケーションの基本④の理解度チェック</h3>

データ・アクセス層に焦点を当て、データの検索・操作と永続化を担当するRepository層について詳細に解説しました。

Repository層の役割やMyBatisを使用するメリット、データ型やSQLクエリの書き方、DML操作についても解説しています。

<h3>理解度チェック⑤</h3>

以下のTESTテーブルを参考に、data.sqlとschema.sqlを作成しTestRepositoryを作成し、以下の下記の期待結果を表示させてください。

<b>TESTテーブル</b>
| カラム名 | データ型 | 主キー |
|:-:|:-:|:-:|
| test_id   |  int |  ✔ |
|  summary |  VARCHAR |   |

<b>期待結果</b>

![スクリーンショット 2023-08-22 21.53.32.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2782718/b305866e-8109-156f-0f58-dce75fe699d0.png)

<h2>まとめ</h2>
Spring Bootを使用したWebアプリケーションの基本的な理解度を確認するためのものです。

以下の内容について理解できているかをチェックしました。

1.MVCモデル：アプリケーションをモデル、ビュー、コントローラの3つのコンポーネントに分割し、それぞれがデータ処理、ユーザーインターフェース、ユーザー入力処理を担当すること。

2.リクエストとレスポンス：Spring BootではControllerクラスでリクエストを処理し、レスポンスを返すこと。

3.Spring Initializrを使用したプロジェクトの新規作成と設定。

4.Thymeleafを使用してHTMLテンプレートを作成し、Controllerクラスで処理する方法。

5.Entityの設計とThymeleafを使用しての表示方法。

6.プレゼンテーション層、ビジネスロジック層、データアクセス層の構造と各層の役割。

7.Repository層とMyBatisの使用方法、データの操作と永続化方法。

8.data.sqlとschema.sqlを使用してデータベースのセットアップと初期データの投入。

以上の内容に関する理解度チェックを行っています。