Spring Boot で、掲示板のサンプルを試す。

2. Build
$ chmod 755 mvnw
$ ./mvnw target

3. run
$ ./mvnw spring-boot:run

ブラウザーから、早速アクセスする。
http://localhost:8080/
すごい!!。うごいた。

4. これから、ソースを追って勉強じゃ!!
1) 一番知りたいこと。
トピックの一覧をテンプレートで、どの様にだすのか。また、その時のリンクの貼り方を知りたい。
/manage ページが参考になりそうじゃ。
各行の修正処理へのリンクは、下記みたい。
/manage?4
/manage?5

controller/PrivateController.java で出している。

Firefox の ソースで確認すると、下記部分じゃ
<tbody id="taMy"> ... <tr id="my5"> <td id="my5PublishDate" class="myPublishDate">03-08-2019 10:00</td> <td id="my5RemoveDate" class="myRemoveDate">Not set</td> <td id="my5Status" class="myStatus">Waiting Approve</td> <td id="my5Description" class="myDescription">Waiting approve message 2</td> <td> <a id="my5Edit" href="/manage/5" class="ui mini green icon button">Edit <i class="edit icon"></i></a> </td> </tr>
id をこんなにユニークにする必要はないのでは、そもそも id でアクセスしていないのでは?。ユニークな id を割り振らなければ、
もっとシンプルになるのでは。
おんちゃんの、長年のプログラムの鉄則は、シンプル イズ ベスト じゃ。!!
もうすこし、簡単につくろうよ!!
試しに、id を取っ払って試してみたが、問題ないみたい。
注) 必ず、オリジナルはバックアップしましょう。
将来、Javascript で、 id で　書き換える処理が生じたら、そのとき使えば良いと思うが!!。
テンプレートは、
resources/templates/private/manage.html
<tbody id="taMy"> <tr th:each="message:${userMessages}" th:object="${message}" th:with="dataId=|my*{id}|" th:id="${dataId}"> <td th:id="|${dataId}PublishDate|" class="myPublishDate" th:text="*{#temporals.format(publishDate, 'dd-MM-yyyy HH:mm')}"></td> <td th:id="|${dataId}RemoveDate|" class="myRemoveDate" th:text="*{removeDate == null}? #{notSet}: *{#temporals.format(removeDate, 'dd-MM-yyyy HH:mm')}"></td> <td th:id="|${dataId}Status|" class="myStatus" th:text="#{__${statusMap.get(message.status)}__}"></td> <td th:id="|${dataId}Description|" class="myDescription" nl2br:text="${message.description}"></td> <td> <a th:if="*{status != null and status == 1}" th:id="|${dataId}Edit|" th:href="@{/manage/__*{id}__}" class="ui mini green icon button">[[#{edit}]] <i class="edit icon"></i></a> </td> </tr> <tr> <td colspan="5"> <a class="ui mini icon button" id="buNewMessage" th:href="@{/manage/new}">[[#{newMessage}]] <i class="add circle icon"></i></a> </td> </tr> </tbody>

試しに、id を少し取ってみたのが、これ。少しは、見やすいか?
<tbody id="taMy"> <tr th:each="message:${userMessages}" th:object="${message}" th:with="dataId=|my*{id}|" th:id="${dataId}"> <td class="myPublishDate" th:text="*{#temporals.format(publishDate, 'dd-MM-yyyy HH:mm')}"></td> <td class="myRemoveDate" th:text="*{removeDate == null}? #{notSet}: *{#temporals.format(removeDate, 'dd-MM-yyyy HH:mm')}"></td> <td class="myStatus" th:text="#{__${statusMap.get(message.status)}__}"></td> <td class="myDescription" nl2br:text="${message.description}"></td> <td> <a th:if="*{status != null and status == 1}" th:id="|${dataId}Edit|" th:href="@{/manage/__*{id}__}" class="ui mini green icon button">[[#{edit}]] <i class="edit icon"></i></a> </td> </tr> <tr> <td colspan="5"> <a class="ui mini icon button" id="buNewMessage" th:href="@{/manage/new}">[[#{newMessage}]] <i class="add circle icon"></i></a> </td> </tr> </tbody>
どうやら、th:each を使うみたいじゃ。

まあ、おそしいことじゃ。
ここまで複雑だと、別の方法を使ったほうが簡単そうだが。
Framework も初期の理想は、より簡単にが目的だったのだろうが、機能が追加するにつれて、最初の理想から外れて、かえって面倒になったと言うことか?
ただ、多言語に対応する場合は、メリットがあるのか。

ここまでふくざつになったら、制作したあと、機能追加などは大変な気がする。
また、おんちゃんの学習のモチベーションが持たない気がする。
半年は、みっちり経験しないと、ものにならないかも。

4.1 あまりぐちをいっても仕方がない。
少し処理を追ってみますじゃ。
http://localhost:8080/manage
のリクエスト処理を見てみる。

login が終わったあとの処理になるとおもう。
spring-noticeboard/src/main/java/info/saladlam/example/spring/noticeboard/controller/PrivateController.java
@GetMapping public String manage(Model model) { List<MessageDto> userMessages = this.messageService.findByOwner(this.getLoginName(), this.getCurrentLocalDateTime()); model.addAttribute("statusMap", statusMap); model.addAttribute("userMessages", userMessages); .... return "private/manage";

1)
List<MessageDto> userMessages = this.messageService.findByOwner(this.getLoginName(), this.getCurrentLocalDateTime());
で、DB から、List<MessageDto> userMessages を取り込んで、
2)
model.addAttribute("userMessages", userMessages);
で、Thymeleaf とのインターフェースである、model へ追加する。

3)
return "private/manage";
で、Thymeleaf で、下記テンプレートを処理する。
spring-noticeboard/src/main/resources/templates/private/manage.html

下記が、message の一覧を出している行で、なんともおぞましいが、Firefox で直接開くとページが見える。
<tbody id="taMy"> <tr th:each="message:${userMessages}" th:object="${message}" th:with="dataId=|my*{id}|" th:id="${dataId}"> <td th:id="|${dataId}PublishDate|" class="myPublishDate" th:text="*{#temporals.format(publishDate, 'dd-MM-yyyy HH:mm')}"></td> <td th:id="|${dataId}RemoveDate|" class="myRemoveDate" th:text="*{removeDate == null}? #{notSet}: *{#temporals.format(removeDate, 'dd-MM-yyyy HH:mm')}"></td> <td th:id="|${dataId}Status|" class="myStatus" th:text="#{__${statusMap.get(message.status)}__}"></td> <td th:id="|${dataId}Description|" class="myDescription" nl2br:text="${message.description}"></td> <td> <a th:if="*{status != null and status == 1}" th:id="|${dataId}Edit|" th:href="@{/manage/__*{id}__}" class="ui mini green icon button">[[#{edit}]] <i class="edit icon"></i></a> </td> </tr> <tr> <td colspan="5"> <a class="ui mini icon button" id="buNewMessage" th:href="@{/manage/new}">[[#{newMessage}]] <i class="add circle icon"></i></a> </td> </tr> </tbody>

4) 下記で、List<MessageDto>model.get("userMessages") の List から、MessageDto message に1行ずつ得られる。
th:each="message:${userMessages}"

5) ここで、class MessageDto は、
spring-noticeboard/src/main/java/info/saladlam/example/spring/noticeboard/dto/MessageDto.java
public class MessageDto { private Long id; @DateTimeFormat(pattern = "dd-MM-yyyy HH:mm") private LocalDateTime publishDate; @DateTimeFormat(pattern = "dd-MM-yyyy HH:mm") private LocalDateTime removeDate; private String owner; private String description; private String approvedBy; private LocalDateTime approvedDate; private Integer status;
で、テンプレートの下記記述は、
nl2br:text="${message.description}"
MessageDto::description を示している。
おんちゃんは、private String description で定義しているので、まさか、Thymeleaf からアクセス出来ないと思って、これじゃないだろうと思っていたら、
Google AI 様にお問い合わせしたら、これだと言われた。
これで、データの流れが見えてきた。やれやれ!!

最後に、googel で下記を検索してみた。
"spring boot Thymeleaf で、private 変数がアクセスできるのはなぜ"
勉強になった。
暗黙的に、getDescription() などが使われるのかも。

5. ちょっと不正使用すると、エラーを吐き出すみたい。
user1 で、5 メッセージを登録して、
user2 で、ログインせずに、下記を叩くと、ログインした後しぬみたい。
http://localhost:8080/manage/5
トピックの NO. はユニーク番号なのだろうか、それとも、user 毎の割当なのか?
多分、 select * from xxx where topic_no='5'; で、対象レコードが無いときのチェック抜けか。
まあ、サンプルプログラムだから許されるか!!

6. おんちゃんの Tips!!
1) テンプレートの、
src/main/resources/templates/index.html を、Firefox で直接開いた時に、 image ファイルのパスの違いを吸収できるみたい。
google で、下記を検索したら教えてくれた。
"spring boot Thymeleaf firefox で直接開いたときは、画像パスを変えたい"

<img width="225" src="../static/image/aki_107.jpg" th:src="@{/image/aki_107.jpg}" />

2) おんちゃんも、20年以上前に、perl で掲示板を作ったが、こちらのほうのオペレーションが、もっと良い気がするが、
フリー掲示板

3) Liquibase を使った、DBの作成
この掲示板プログラムは、Liquibase を使って、DB の作成をしている、下記に、参考になるページがあったので、リンクしておきます。
【Liquibase】DB作成・テーブル定義変更