21.12.08 캐시 기능 추가 및 리팩토링

__기본기능__
 v 권한 구분 관리자 권한 구현
 v 소셜로그인 기능
 v 블로그 기본 CRUD
 v 연관 카테고리 글 목록
 v 썸네일업로드시 이미지서버에 선업로드 후 URL반환
 v 댓글과 대댓글 구현
 v 메인화면은 무한스크롤 구현
 v 카테고리 화면에서는 페이징박스로 페이징구현
 v 토스트 에디터 사용
 v 토스트 에디터로 작성된 메인 컨텐츠 파싱해서 SSR으로 html출력
 v 쿠키로 이미 읽은 글인지 체크해서 조회수 중복 방지
 v 게시물 조회수 순위별 조회
 v 최근 게시물 조회
 v 최근 코멘트 노출
 v 블로그 태그별 검색과 태그 보이기
 v 일반 검색기능
 v 썸네일 링크로도 추가 가능
 v 카테고리 목록 편집기 개발
 v 비밀댓글 기능
 v 글 포스팅시 자동 커밋 푸시
 v 글 1분단위 자동저장
 v 공유하기 기능
 v reCache 사용하여 레이아웃용 조회값들 캐싱
 v seo 최적화
  v 자동 메타태그 작성
  v rss피드
 v 1차 백엔드 코드 리팩토링

__현재 일정__
  - robot.txt
  - 사이트맵.xml
  - 에러 제어
  - 프론트엔드 코드 리팩토링
  - 디버깅
  - 무중단 배포

__ 고려중__
 - 테스트 코드작성
 - aop 도입
___
나중에 개발해볼 기능
 - toc
 - 이메일 구독기능
 - 새로운 글 토스트 알람 보내기

src/main/java/myblog/blog/article/controller/ArticleController.java

@@ -228,7 +228,7 @@ public class ArticleController {
                               @CookieValue(required = false, name = "view") String cookie,
                               HttpServletResponse response,
                               Model model) {
-        // 1. 로그인 여부에 따라 뷰단에 출력 여부 결정
+        // 1. 로그인 여부에 따라 뷰단에 회원정보 출력 여부 결정
         if (principal != null) {
             model.addAttribute("member", modelMapper.map(principal.getMember(), MemberDto.class));
         } else {

src/main/java/myblog/blog/base/config/CacheConfig.java

@@ -32,7 +32,11 @@ public class CacheConfig {
     @Bean
     public EhCacheCacheManager ehCacheCacheManager(){
 
-        // 1. 레이아웃에 필요한 단건 dto 캐시
+        /*
+            1. 레이아웃에 필요한 단건 dto 캐시
+                - key 0 : 레이아웃 카테고리
+                - key 1 : 메인화면 인기 아티클
+        */
         CacheConfiguration layoutCacheConfiguration = new CacheConfiguration()
                 .eternal(false)
                 .timeToIdleSeconds(0)

src/main/resources/templates/article/articleList.html

@@ -51,7 +51,7 @@
     <div class="recent-cards mt-5 ms-4 me-4">
 
         <div class="cards-container container p-0" id="infiniteScrollBox">
-            <h1 class="text-center" th:text="${param.category}">최신 포스팅</h1>
+            <h1 class="text-center" th:text="${param.category}">카테고리 명</h1>
             <hr>
             <div id="articlePage-0">
                 <div class="card mb-3 recent-card wow fadeInUp" th:each="article :${articleList.getContent()}">
@@ -78,7 +78,6 @@
         </div>
     </div>
 
-
     <!-- page s -->
     <div class="pagination-section mt-4">
         <nav class="pagination-outer" aria-label="Page navigation">

src/main/resources/templates/layout/layout.html

@@ -16,10 +16,10 @@
                 <i class="fas fa-bars"></i>
             </button>
             <div id="nav-brand">
-                <a th:href="@{/}"><h4>Blog</h4></a>
+                <a th:href="@{/}"><h4>Jinia's LOG</h4></a>
             </div>
             <div id="nav-login" sec:authorize="!isAuthenticated()">
-                <a th:href="@{/login}"><i class="far fa-address-card pe-2"></i></a>
+                <a th:href="@{/login}"><i class="fas fa-sign-in-alt pe-2 fs-4"></i></a>
             </div>
             <div sec:authorize="isAuthenticated()" class="pe-2">
                 <span sec:authorize="hasRole('USER')" th:text="${#authentication.name} + '님'"></span>

src/main/resources/templates/layout/sideBar.html

@@ -5,14 +5,17 @@
 <div th:fragment="sideBar">
 
     <div class="m-4 sidebar-header">
-        <a th:href="@{/}"><h4 class="text-black-50">BLOG</h4></a>
-        <a href="#"><h4 class="text-black-50">ABOUT ME</h4></a>
+        <a th:href="@{/}"><h3 class="text-black-50" style="white-space: nowrap">Jinia's LOG</h3></a>
+        <a href="#"><h5 class="text-black-50">ABOUT ME</h5></a>
         <a sec:authorize="hasRole('ADMIN')" th:href="@{/article/write}" href="#">
-            <h4 class="text-black-50">WRITE ARTICLE</h4>
+            <h5 class="text-black-50" style="white-space: nowrap">NEW ARTICLE</h5>
         </a>
+
     </div>
 
-    <div class="pb-3 mb-3 link-dark border-bottom">
+    <div class="border-top my-3"></div>
+
+    <div class="mb-1 link-dark">
         <div class="searchBox">
             <input id="searchInput" name="searchInput" class="searchInput form-control ps-4" type="text"
                    onkeyup="if(window.event.keyCode==13){searchKeyword()}">
@@ -35,9 +38,11 @@
             </div>
         </li>
 
+        <li class="border-top my-3"></li>
+
         <li class="mb-1 superCategory btn fs-5"><a th:href="@{/article/list(category=total,tier=0,page=1)}"
                                                    th:text="|전체글(${category.getCount()})|">토탈</a></li>
-        <a th:href="@{/edit/category}" sec:authorize="hasRole('ADMIN')" class="me-0 btn"><i class="fas fa-pen"></i></a>
+        <a th:href="@{/edit/category}" sec:authorize="hasRole('ADMIN')" class="me-0 ps-0 btn"><i class="fas fa-pen"></i></a>
 
         <li class="mb-1" th:each="superCategory : ${category.getCategoryTCountList()}">
             <div class="btn-group">
@@ -79,23 +84,33 @@
         </li>
 
         <li class="border-top my-3"></li>
+
         <li class="mb-1">
-            <button class="btn btn-toggle align-items-center rounded collapsed fs-5" data-bs-toggle="collapse"
-                    data-bs-target="#account-collapse-xl" aria-expanded="true">Account
-            </button>
-            <div class="collapse show" id="account-collapse-xl">
+            <div >
+                <ul class="btn-toggle-nav list-unstyled fw-normal pb-1">
+                    <li><a th:href="@{/rss}" class="link-dark rounded">
+                        <i class="fas fa-rss" style="font-size: 20px;"></i>&nbsp RSS FEED</a>
+                    </li>
+                </ul>
+            </div>
+        </li>
+
+        <li class="border-top my-3"></li>
+        <li class="mb-1">
+            <div>
                 <ul class="btn-toggle-nav list-unstyled fw-normal pb-1 small">
                     <li sec:authorize="!isAuthenticated()"><a th:href="@{/login}"
-                                                              class="link-dark rounded">로그인</a></li>
-
-                    <li sec:authorize="hasRole('USER')" class="ms-3" th:text="${#authentication.name} + '님 환영합니다'"></li>
-                    <li sec:authorize="hasRole('ADMIN')" class="ms-4" th:text="관리자계정"></li>
+                                                              class="link-dark rounded"><i class="fas fa-sign-in-alt"></i>&nbsp로그인</a></li>
 
                     <li sec:authorize="isAuthenticated()">
                         <form method="post" id="logout" name="logout" th:action="@{/logout}">
-                            <button class="btn"><a class="btn">로그아웃</a></button>
+                            <button class="btn"><a class="link-dark rounded ms-1 small"><i class="fas fa-sign-out-alt"></i></i>&nbsp로그아웃</a></button>
                         </form>
                     </li>
+
+                    <li sec:authorize="hasRole('USER')" class="ms-3 small" th:text="${#authentication.name} + '님 환영합니다'"></li>
+                    <li sec:authorize="hasRole('ADMIN')" class="ms-4 small" th:text="|(관리자계정)|"></li>
+
                 </ul>
             </div>
         </li>