From 8a7c755d43beb25e44f645404f9cb1fdc1623420 Mon Sep 17 00:00:00 2001
From: haerong22 <haerong22@naver.com>
Date: Sun, 14 Aug 2022 04:17:38 +0900
Subject: [PATCH] #16 board : articles page impl

---
 .../resources/templates/articles/index.html   | 28 +++++++++++--------
 .../resources/templates/articles/index.th.xml | 11 ++++++++
 2 files changed, 28 insertions(+), 11 deletions(-)
diff --git a/board/src/main/resources/templates/articles/index.html b/board/src/main/resources/templates/articles/index.html
index d43c5d88..32396e75 100644
--- a/board/src/main/resources/templates/articles/index.html
+++ b/board/src/main/resources/templates/articles/index.html
@@ -13,7 +13,10 @@
 
 <body>
 
-    <header id="header"></header>
+    <header id="header">
+        헤더
+        <hr>
+    </header>
 
     <main class="container">
         <div class="row">
@@ -53,22 +56,22 @@
             </div>
         </div>
 
-        <table class="table">
+        <table class="table" id="article-table">
             <thead>
                 <tr>
-                    <th class="col-6">제목</th>
-                    <th class="col-2">해시태그</th>
-                    <th class="col">작성자</th>
-                    <th class="col">작성일</th>
+                    <th class="title col-6">제목</th>
+                    <th class="hashtag col-2">해시태그</th>
+                    <th class="user-id col">작성자</th>
+                    <th class="created-at col">작성일</th>
                 </tr>
             </thead>
 
             <tbody>
                 <tr>
-                    <td>첫 글</td>
-                    <td>#Java</td>
-                    <td>kim</td>
-                    <td>2022-08-09</td>
+                    <td class="title"><a>첫 글</a></td>
+                    <td class="hashtag">#Java</td>
+                    <td class="user-id">kim</td>
+                    <td class="created-at"><time>2022-08-09</time></td>
                 </tr>
                 <tr>
                     <td>두번째 글</td>
@@ -96,7 +99,10 @@
         </nav>
     </main>
 
-    <footer id="footer"></footer>
+    <footer id="footer">
+        <hr>
+        푸터
+    </footer>
 
     <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.2.0/dist/js/bootstrap.bundle.min.js" integrity="sha384-A3rJD856KowSb7dwlZdYEkO39Gagi7vIsF0jrRAoQmDKKtQBHUuLZ9AsSv4jD4Xa" crossorigin="anonymous"></script>
 </body>
diff --git a/board/src/main/resources/templates/articles/index.th.xml b/board/src/main/resources/templates/articles/index.th.xml
index bbfb3414..0c1823e2 100644
--- a/board/src/main/resources/templates/articles/index.th.xml
+++ b/board/src/main/resources/templates/articles/index.th.xml
@@ -2,4 +2,15 @@
 <thlogic>
     <attr sel="#header" th:replace="header :: header" />
     <attr sel="#footer" th:replace="footer :: footer" />
+
+    <attr sel="#article-table">
+        <attr sel="tbody" th:remove="all-but-first">
+            <attr sel="tr[0]" th:each="article : ${articles}">
+                <attr sel="td.title/a" th:text="${article.title}" th:href="@{'/articles/' + ${article.id}}" />
+                <attr sel="td.hashtag" th:text="${article.hashtag}" />
+                <attr sel="td.user-id" th:text="${article.nickname}" />
+                <attr sel="td.created-at/time" th:datetime="${article.createdAt}" th:text="${#temporals.format(article.createdAt, 'yyyy-MM-dd')}"/>
+            </attr>
+        </attr>
+    </attr>
 </thlogic>
\ No newline at end of file

제목	해시태그	작성자	작성일	제목	해시태그	작성자	작성일
첫 글	#Java	kim	2022-08-09	첫 글	#Java	kim	2022-08-09
두번째 글