[무한댓글 게시판] 5. CRUD

Spring Boot

[무한댓글 게시판] 5. CRUD

어코링 2024. 2. 19. 17:00

소셜 게시판 로그인을 먼저 해주었다.

그리고 게시판으로 가자.

게시글 상세 페이지 이동

글 번호를 누르면 해당 상세페이지로 이동을 한다

해당 게시글의 board_id 컬럼 값을 전달 해주어 받아서 해당 게시글의 상세페이지를 반환 한다.

로직은 아래와 같다.

BoardController.java

우선 controller다.

BoardSevice.java

@RequestParam으로 board_id 컬럼을 요청해서 변수 board_id로 넣어줘서 사용을해서 해당 BoardService에 만들어둔 selectDetail 메서드로 해당 게시글을 반환하는 변수를 만들어서 model.attribute로 boardDetail에 넣어주었다. 따라서 jsp파일에서 boardDetail을 사용할수 있게 되었다.

boardDetail.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>소셜로그인 게시판</title>
</head>
<body>
	<div id="wrap">
		<h2>게시글 상세페이지</h2>
		<table>
			<c:if test="${not empty requestScope.boardDetail}">
				<tr height="40">
					<th>게시글 번호</th>
					<td>${requestScope.boardDetail.board_id}</td>
				</tr>
				<tr height="40">
					<th>게시글 제목</th>
					<td>${requestScope.boardDetail.board_title}</td>
				</tr>
				<tr height="40">
					<th>게시글 내용</th>
					<td>${requestScope.boardDetail.board_content}</td>
				</tr>
				<tr height="40">
					<th>작성자</th>
					<td>${requestScope.boardDetail.useremail}</td>
				</tr>
				<tr height="40">
					<th>등록일</th>
					<td>${requestScope.boardDetail.board_regdate}</td>
				</tr>
				<tr height="40">
					<th>좋아요수</th>
					<td>${requestScope.boardDetail.board_likes}</td>
				</tr>
				<tr height="40">
					<th>조회수</th>
					<td>${requestScope.boardDetail.board_views}</td>
				</tr>
				<tr height="40">
					<th>게시글 수정일자</th>
					<td>${requestScope.boardDetail.board_moddate}</td>
				</tr>
			</c:if>
		</table>
		<div>
			<a href="boardModify?board_id=${requestScope.boardDetail.board_id}">수정하기</a>
		</div>
		<div class="home-link">
			<a href="boardPage">게시판 목록</a>
		</div>
		<div class="home-link">
			<a href="/home">Home</a>
		</div>

	</div>

</body>
</html>

${requestScope.boardDetail.컬럼명}으로 board_id값에 해당하는 게시글의 컬럼을 반환할 수 있었다.

1. 새글 작성

새글을 작성하는 페이지(jsp)와 그에 맞는 로직을 작성해보자.

BoardController.java

우선 새글 등록 페이지로 가는 getBoardInsert 메서드이다. 메서드 구현부분은 넣지 않아 간단하여 설명은 생략하겠다.

jsp 파일에서 form데이터를 post(Action)으로 값을 넘겨주기 때문에 @PostMapping으로 값을 받아온다.

uri 변수를 생성해주고

새로 작성된 게시글은 board_delyn 속성을 'N'으로 설정되게 해주었다. (글 삭제여부 옵션)

entity.setBoard_regdate(LocalDateTime.now().format(DateTimeFormatter.ofPattern("yyyy-MM-dd HH:mm:ss")));
			int savedId = boardService.save(entity);

등록된 글의 등록일을 우선 entity에 저장을 해주었다.

그리고 그 값이 0보다 크면 (=값이 있으면) 등록이 되게끔 로직을 짜주었다.

시연동영상

2. 글 수정

BoardController.java

우선 수정페이지로 가는 getBoardModify 메서드이다. 게시글 상세페이지 로직이랑 동일하여 상세설명은 생략하겠다.

역시나 jsp 파일에서 form데이터를 post(Action)으로 값을 넘겨주기 때문에 @PostMapping으로 값을 받아온다.

수정된 데이터를 updateBoard에 넣어주었다. updateBoard에 값을 save 메서드로 저장해주고

그 값이 0보다 크면 (무결성이 깨지면, 수정데이터가 있다면) board_moddate 속성이 수정날짜로 업데이트 되고 변경사항을 저장해준다.

boardModify.java

<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>소셜로그인 게시판</title>
</head>
<body>
	<div id="wrap">
		<h2>게시글 상세페이지</h2>
		<!-- 수정할 내용 입력 폼 -->
		<form action="updateBoard" method="post" enctype="multipart/form-data">
			<table>

				<tr>
					<th>게시글 제목</th>
					<td><input type="text" name="board_title"
						value="${requestScope.boardModify.board_title}"> <input
						type="hidden" name="board_id"
						value="${requestScope.boardModify.board_id}"></td>
				</tr>
				<tr>
					<th>게시글 내용</th>
					<td><textarea rows="5" cols="50" id="board_content"
							name="board_content">${requestScope.boardModify.board_content}</textarea>
				</tr>
				<tr height="40">
					<th>작성자 (수정불가)</th>
					<td><input type="hidden" name="useremail"
						value="${requestScope.boardModify.useremail}">${requestScope.boardModify.useremail}</td>
				</tr>
				<tr height="40">
					<th>등록일 (수정불가)</th>
					<td><input type="hidden" name="board_regdate"
						value="${requestScope.boardModify.board_regdate}">${requestScope.boardModify.board_regdate}</td>
				</tr>
				<tr height="40">
					<th>좋아요수</th>
					<td><input type="hidden" name="board_likes"
						value="${requestScope.boardModify.board_likes}">${requestScope.boardModify.board_likes}</td>
				</tr>
				<tr height="40">
					<th>조회수</th>
					<td><input type="hidden" name="board_views"
						value="${requestScope.boardModify.board_views}">${requestScope.boardModify.board_views}</td>
				</tr>
				<tr height="40">
					<th>게시글 수정일자</th>
					<td><input type="hidden" name="board_moddate"
						value="${requestScope.boardModify.board_moddate}">${requestScope.boardModify.board_moddate}</td>
				</tr>
				<tr>
					<td><input type="submit" value="수정"></td>
				</tr>
			</table>
			<div class="home-link">
				<a href="boardPage">게시판 목록</a>
			</div>
			<div class="home-link">
				<a href="/home">Home</a>
			</div>
		</form>
		  <form action="deleteBoard" method="post">
            <input type="hidden" name="board_id" value="${requestScope.boardModify.board_id}">
            <input type="hidden" name="board_delyn" value="${requestScope.boardModify.board_delyn}">
            <button type="submit">게시글 삭제하기</button>
        </form>
	</div>

</body>
</html>

시연동영상

3. 글 삭제

본 프로젝트는 글을 삭제 했을 때 실제로 데이터 테이블에서 글이 삭제되는 것이 아니라. board_delyn 컬럼 값이 'N'에서 'Y'로 바뀌면서 작성해두었던 query 문에 필터링되어서 select 되지 않아 UI에서 보이지 않는 것이다.

따라서 delete 메서드를 작성하는 것이 아니라 board_delyn 컬럼 값이 'N'에서 'Y'로 바꾸는 로직을 짤 것이다.

BoardController.java

간단히 board_delyn 컬럼 값이 'N'에서 'Y'로 바꾸어서 boardService에 값을 저장을 해주었다.

시연동영상