1.Spring MVCパターンに基づいた掲示板（Board）プログラムの全体のデータフローとアーキテクチャ図（構造図）です。
主要機能別のフロー解説
代表的な機能のフローを追いかけると、全体の構造が理解しやすくなります。
① 記事一覧の表示 (list.do)
1.ユーザーが list.jsp 画面にアクセスするか、リクエストを送ります。
2.Controller の list(request, response) メソッドが呼び出されます。（GET方式）
3.Controller は DAO の select(): List を呼び出します。
4.DAO は DB で select * from board order by board_id desc クエリを実行し、記事一覧を取得します。
5.取得した一覧（List）を Controller が受け取り、list.jsp に渡すことで、画面に記事一覧が表示されます。
② 新規記事の登録 (register.do)
画面移動 (GET): register.jsp へ移動し、ユーザーがタイトルや内容を入力できるフォームを表示します。
実際の保存 (POST):
1.ユーザーが入力後に保存ボタンを押すと、registerPOST リクエストが発生します。
2.パラメータとして タイトル（boardTitle）、内容（boardContent）、作成者（memberId）が Controller へ送られます。
3.Controller はこれらのデータをまとめて DAO の insert(BoardVO vo) を呼び出します。
4.DAO が DB に insert into board values (...) クエリを実行して保存し、成功すると index.jsp へ画面を遷移（リダイレクト）させます。
③ 記事の詳細表示 (detail.do)
1.list.jsp などで特定の記事をクリックすると、記事番号（boardId）を持って detail.do リクエストを送ります。
2.Controller は受け取った boardId を使って DAO の select(int boardId) を呼び出します。
3.DAO は DB から該当する番号の記事を1件だけクエリ（select * from board where board_id = ...）し、BoardVO オブジェクトに格納して返します。
4.Controller はこの詳細データを持って detail.jsp 画面を表示します。
④ 記事の修正 (update.do) と 削除 (delete.do)
修正: updateGET で既存のデータを読み込んで修正フォーム（update.jsp）に表示し、ユーザーが修正して保存すると updatePOST が動作して、DAO の update メソッド経由で DB を更新します。
削除: deletePOST リクエストが入ると、boardId を DAO に渡し、DB から該当するレコードを delete します。
掲示板システムに「ページング処理（Paging / ページネーション）」の機能が追加されたデータフロー図です。
Pagination
- 新しく追加された重要キーワード（クラス）
ページングを実装するために、以下の要素が新しく組み込まれています。
PageCriteria (または Criteria): * 画面下部にあるクラスです。「現在何ページ目を見ているか（page）」と「1ページに何件の記事を表示するか（numsPerPage）」という情報を保持するバケツの役割をします。
PageMaker.java:
左下にあるクラスです。全体の記事数（totalCount）と、現在のページ情報（PageCriteria）を計算して、画面の下に表示する「 [1] [2] [3] [次へ] 」のようなページボタン（ナビゲーション）を生成する役割を担います。
2. ページング処理の一連のフロー（list.do）
ユーザーが「2ページ目を見たい」とリクエストした時の流れを追ってみましょう。
① リクエストの発生（画面 ➔ Controller）
-
ユーザーが画面（index.jsp または list.jsp）から特定のページ番号をクリックします。
-
Controller（list.do）に対して、リクエストパラメータとして「文字列のページ番号（String page）」が渡されます。
② データ件数の取得とクエリの実行（Controller ➔ DAO ➔ DB）
1.Controllerは、まずDBの中に全部で何件の記事があるかを把握するため、DAOの getTotalCount() を呼び出します。
SQL: select count(board_id) as total_cnt from board
これにより、全体の件数（int totalCount）がControllerに戻ってきます。
2.次に、Controllerは PageCriteria（例：2ページ目、10件ずつ）を DAO の select() メソッドに渡します。
3.DAOは、全データの中から「必要なページの部分だけ」を切り取るためのサブクエリ（row_number()）を使った効率的なSQLを実行します。
SQL: select * from (...) where rn between start and end;
これにより、2ページ目に該当する10件だけのデータ（List）がControllerに返されます。
③ ページナビゲーションの作成（Controller ➔ PageMaker）
-
Controllerは、先ほど取得した「全体の件数（totalCount）」と「現在のページ情報（PageCriteria）」を PageMaker.java に渡します。
-
PageMaker はこれを計算し、「前のページはあるか？」「次のページはあるか？」「エンドページはいくつか？」といった画面表示に必要な情報を組み立てます。
④ 画面への出力（Controller ➔ list.jsp）
- Controllerは、最終的に以下の2つのデータをセットにして list.jsp へ送ります（Response）。
1.List（切り出された10件の記事データ）
2.PageMaker pageMaker（ページボタンを描画するための情報）
- list.jsp は、受け取った記事リストを綺麗に表示し、画面下部に pageMaker の情報を使って [1] [2] [3] といったリンクを生成します。
掲示板の中の「コメント（返信・リプライ：Reply）機能」に特化したデータフロー図です。
Reply.drawio.html
- コア構成要素（Reply専用のパーツ）
Reply テーブル（DB）: 一番右側です。コメントを保存するテーブルで、どの記事に対するコメントなのかを識別するために BOARD_ID を外部キー（FK）として持っています。
ReplyVO.java: コメント1件のデータ（replyId, boardId, memberId, replyContent など）を運ぶバケツです。
ReplyDAOImple.java: コメントの登録、取得、修正、削除のSQLクエリ（insert, select, update, delete）を直接実行します。
ReplyController.java: コメントに関するリクエスト（/replies/add, /replies/list など）を一手に引き受けるコントローラーです。図の中に response url : Asynchronous（非同期） と書かれているのが特徴です。
detail.jsp & JavaScript関数（左側）: ユーザーが見ている画面（detail.jsp）から、画面をリロードせずに裏側でデータを送受信するため、writeReply(), getReplyList(), updateReply(), deleteReply() というJavaScriptの関数が起点となっています。
2. 非同期通信による主要フロー解説
① コメントの登録 (/replies/add)
1.ユーザーが detail.jsp でコメントを入力し、登録ボタンを押すと、JavaScriptの writeReply() が作動します。
2.画面はそのままの状態で、裏側で boardId, memberId, replyContent が POST方式 で ReplyController へ送られます。
3.Controllerは受け取ったデータを ReplyVO に詰め、DAOの insert(ReplyVO vo) を呼び出してDBに保存します。
4.処理が終わると、Controllerは新しい画面を返すのではなく、「String result（成功したという結果の文字列：例えば "SUCCESS" など）」だけを画面に返します。
5.これを受け取った画面側は、次に説明する「一覧の再取得」を自動で呼び出します。
② コメント一覧の取得 (/replies/list)
1.記事詳細画面が開いた時や、コメントが登録・修正・削除された瞬間に、JavaScriptの getReplyList() が自動で走ります。
2.コントローラーの /replies/list へ、現在の記事番号（boardId）を GET方式 で送ります。
3.Controllerは DAO の select(int boardId) を呼び出し、その記事に紐づくコメントだけをDBからまとめて取得します。
SQL: select * from Reply where Board_id = ... order by Reply_id desc;
4.Controllerは、取得した List（コメントのリスト）をそのまま画面に返します。（一般的にJSONというデータ形式に変換して返されます）
5.detail.jsp のJavaScriptは、届いたデータを使って、コメント欄の部分だけを新しく書き換えて表示します。
③ コメントの修正 (/replies/update) と 削除 (/replies/delete)
修正: updateReply() 関数が動き、コメント番号（replyId）と新しい内容（replyContent）を POST で送ります。DAOが update クエリを実行し、成否の結果（String result）だけを画面に戻します。
削除: deleteReply() 関数が動き、コメント番号（replyId）を POST で送ります。DAOが delete クエリを実行し、同じく結果（String result）だけを画面に戻します。