게시판 구현

꿀이·2022년 1월 18일
0

요구사항

  • 회원/비회원 모두 게시글 열람 및 검색을 할 수 있음
  • 비회원은 글쓰기 불가, 회원은 글쓰기 및 자신이 작성한 게시글 수정 가능
  • 한 페이지에 10개의 게시글씩 출력
  • (추가)검색 기능

테이블 연관관계

회원-게시글 의 관계는 1:N 관계 같은데... 회원은 게시글을 여러개 쓸 수 있고... 게시글은 작성자 한명과 매핑이 되니까...

우선 아래와 같이 엔티티 생성 및 더미데이터를 넣어줬다.


페이징 구현

게시판 페이지를 클릭하면 해당 페이지 번호를 GET요청할때 파라미터로 넘겨줬고, 컨트롤러에서는 해당 페이지 인덱스를 기준으로 10개씩 db에서 조회를 해서 뷰로 넘겨줄거다.

    @GetMapping("/bulletinBoard/{page}")
    public String board(@PathVariable Integer page, Model model) {
    
        List<Post> posts = postService.getAllPost(page-1);

        model.addAttribute("page", page);
        model.addAttribute("posts", posts);
        return "bulletinBoard/bulletinBoard";
    }

타임리프를 이용해서 시작페이지값을 조작해서 1~10, 11~20 페이지 인덱스를 보여주게 했다. 1페이지에서는 이전페이지 href를 제거했다. 현재는 Next 버튼을 계속 누르면 계속 숫자가 증가하는데, 이후에 마지막 게시글이 있는 페이지 까지만 출력해주느걸로 변경해보자. -> 이건 서버에서 처리하는게 좋을까..?


검색 기능 추가

쿼리는 다음과 같이 작성을 했다. 글 제목중에 검색어를 포함하는 게시글들을 10개씩 불러올거다.

컨트롤러는 다음과 같다. 검색할때 넘어온 쿼리파라미터들을 다시 넘겨줬다. view에서 페이징할때 사용하려고.

    @GetMapping("/bulletinBoard/search")
    public String searchPost(@RequestParam String searchContent,@RequestParam(defaultValue = "1") int page, Model model) {

        List<Post> posts = postService.findPostByKeyword(searchContent,page-1);

        //1~10 , 11~20 , ... 시작 페이지 번호를 계산해서 넘겨주자
        setModelAboutSearchPost(model,posts,page,searchContent);
        return "bulletinBoard/searchKeywordResult";
    }

페이지 링크를 누를때 컨트롤러에서 전달받은 검색어를 다시 사용해서 href를 작성했다.

<nav aria-label="Page navigation example">
        <ul class="pagination justify-content-center">
            <li class="page-item">
                <a class="page-link" th:if="${page gt 1}" th:href="@{/bulletinBoard/search(searchContent=${searchContent},page=${page-1})}">Previous</a>
                <a class="page-link"  th:unless="${page gt 1}" >Previous</a>
            </li>
            <li class="page-item"  th:each="num:${#numbers.sequence( startPage,endPage)}">
                <a class="page-link" th:href="@{/bulletinBoard/search(searchContent=${searchContent},page=${num})}"><span th:text="${num}">1</span></a>
            </li>
            <li class="page-item">
                <a class="page-link" th:href="@{/bulletinBoard/search(searchContent=${searchContent},page=${page+1})}">Next</a>
            </li>
        </ul>
    </nav>

profile
내게 맞는 옷을 찾는중🔎

0개의 댓글