[구디아카데미 IT국비지원] 카테고리별 회원전용 게시판 프로젝트를 마무리했다. 게시글 추가/수정/삭제 기능과 댓글 수정/삭제 기능을 추가하고 CSS 작업을 했다. 또한, 이전/다음 버튼만 있던 기존 페이징을 중간에 페이지넘버를 선택할 수 있도록 변경해보았다!

💡 카테고리별 회원전용 게시판 프로젝트

📌 작업기록

✔ 게시글

• 게시글 추가
  insertBoardForm.jsp
  insertBoardAction.jsp
  👉 회원만 가능

• 게시글 수정/삭제
  updateBoardForm.jsp
  updateBoardAction.jsp
  deleteBoardAction.jsp
  👉 회원 본인만 가능

✔ 댓글

• 댓글 수정/삭제
  updateCommentForm.jsp
  updateCommentAction.jsp
  deleteCommentAction.jsp
  👉 회원 본인만 가능
• comment 테이블 board_no 외래키 cascade 설정

✔ CSS

• Bootswatch
  Bootswatch의 Sketchy 테마를 이용했다.

💡 중간 페이징

이전/다음 버튼만 있었던 기존 페이징에서 이전/다음 사이에 페이지를 직접 선택할 수 있도록 페이지넘버가 추가된 중간 페이징으로 업그레이드해보았다!

추가되는 변수는 다음과 같다.

• int pageLength : 페이지 한 묶음(블록)에 페이지가 몇 개씩 들어가도록 할지 지정한다.
• int currentBlock : 현재 몇 번째 페이지 블록인지
• int startPage : 현재 페이지 블록의 시작 페이지
• int endPage : 현재 페이지 블록의 끝 페이지

currentBolock은 반드시 추가해야되는 변수는 아니다.

int pageLength = 10;
int currentBlock = currentPage / pageLength;
	if(currentPage % pageLength != 0) {
		currentBlock = currentBlock + 1;
	}
int startPage = (currentBlock - 1) * pageLength + 1; 
int endPage = startPage + pageLength - 1 ;
	if(endPage > totalPage) {
		endPage = totalPage;
	}

페이지 출력 시

<!------- 페이징 시작 ------->
<div>
	<ul class="pagination" style="justify-content : center;">
		<%
			if(startPage == 1) {
		%>
				<li class="page-item disabled">
					<a class="page-link" href="#">&laquo;</a>
				</li>
		<%
			} else {
		%>
				<li class="page-item">
					<a class="page-link" href="<%=request.getContextPath()%>/home.jsp?currentPage=<%=startPage - 1%>&rowPerPage=<%=rowPerPage%>&localName=<%=localName%>">&laquo;</a>
				</li>
		<%
			}
		%>
		<%
			for(int i = startPage; i <= endPage; i++) {
		%>
				<li class="page-item <%if(i == currentPage){%> active <%}%>">
					<a class="page-link" href="<%=request.getContextPath()%>/home.jsp?currentPage=<%=i%>&rowPerPage=<%=rowPerPage%>&localName=<%=localName%>">
						<%=i%>
					</a>
				</li>
		<%
			}
		%>
		<%
			if(totalPage == endPage) {
		%>
				<li class="page-item disabled">
					<a class="page-link" href="#">&raquo;</a>
				</li>
		<%
			} else {
		%>
				<li class="page-item">
					<a class="page-link" href="<%=request.getContextPath()%>/home.jsp?currentPage=<%=endPage + 1%>&rowPerPage=<%=rowPerPage%>&localName=<%=localName%>">&raquo;</a>
				</li>
		<%
			}
		%>
	</ul>
</div>
<!------- 페이징 끝 ------->

📍 결과