-
나프 - 게시판 만들기(2)Web/Spring 2023. 8. 2. 22:07
1. 게시판 서비스 계층 구현하기
> Service 인터페이스 생성 (책임 정의)
public interface BoardService { public List<BoardVO> getList();//게시물 가져오기 public void register(BoardVO board); // 게시물 등록 public BoardVO get(int bno); //게시물 상세보기 public int remove (int bno); // 게시물 삭제 public int modify (BoardVO board); }
@Service public class BoardServiceimpl implements BoardService{ @Autowired private BoardMapper mapper;
- 서비스 구현체는 mapper를 주입 받아 메서드 구현하면 된다.
- 구현체도 @Service 어노테이션을 통해 스프링 컨테이너에 등록해야함
- Controller가 Service와 메시지를 주고받기 때문
- root-context나 servlet-context 어느쪽을 통해 등록해도 상관은 없다.
<context:component-scan base-package="kr.inflearn.service" />
2. 웹 계층 구현(1) - 리스트 보기
2.1 list 메서드 추가
6. @Controller 7. public class BoardController { 8. 9. @Autowired 10. private BoardService service; 11. 12. @RequestMapping("/list.do") 13. public String list(Model model) { 14. List<BoardVO> list = service.getList(); 15. model.addAttribute("list", list); 16. return "boardList"; 17. }
2.2 boardList.jsp 생성
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %> <%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %> <!DOCTYPE html> <html lang="en"> <head> <title>Bootstrap Example</title> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css"> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.4/jquery.min.js"></script> <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/js/bootstrap.min.js"></script> </head> <body> <div class="container"> <h2>메인화면</h2> <div class="panel panel-default"> <div class="panel-heading">Spring WEB MVC 게시판 만들기</div> <div class="panel-body"> <div class="table-responsive"> <table class="table"> <thead> <tr> <th>게시물 번호</th> <th>제목</th> <th>조회수</th> <th>등록자</th> <th>등록일</th> </tr> </thead> <tbody> <c:forEach var="vo" items="${list}"> <tr> <td>${vo.idx}</td> <td>${vo.title}</td> <td>${vo.count}</td> <td>${vo.writer}</td> <td><fmt:formatDate pattern="yyyy-MM-dd" value="${vo.indate}"/></td> </tr> </c:forEach> </tbody> </table> </div> </div> <div class="panel-footer">인프런 화이팅</div> </div> </div> </body> </html>
3. 등록 UI 만들기 (register.jsp)
3.1 boardList.jsp에 등록버튼 및 script 추가
$(document).ready(function(){ $("#regBtn").click(()=>{ location.href="<c:url value='/register.do'/>"; }); }); <div class="panel-heading">Spring WEB MVC 게시판 만들기 <button id="regBtn" type="button" class="btn btn-xs pull-right btn-primary">게시물 쓰기</button> </div>
3.2 컨트롤러 요청 방식에 따라 같은 요청을 다른 메서드가 처리하도록 만들기
@RequestMapping(value="/register.do",method=RequestMethod.GET) //@GetMapping public String registerGET() { return "register"; //게시물 등록 화면 보여주기 (boardList에서) } @RequestMapping(value="/register.do",method=RequestMethod.POST) //@PostMapping public String registerPOST(BoardVO board) { service.register(board); return "redirect:/list.do"; //게시물 등록 (register.jsp에서) }
3.3 register.jsp
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %> <!DOCTYPE html> <html lang="en"> <head> <title>Bootstrap Example</title> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css"> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.4/jquery.min.js"></script> <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/js/bootstrap.min.js"></script> </head> <body> <div class="container"> <h2>Board Register</h2> <div class="panel panel-default"> <div class="panel-heading">Board Register</div> <div class="panel-body"> <form action="<c:url value='register.do'/>" method="post"> <div class="form-group"> <label>Title</label> <input type="text" class="form-control" id="title" name="title"> </div> <div class="form-group"> <label>Text area</label> <textarea class="form-control" rows=3 name="contents" ></textarea> </div> <div class="form-group"> <label>Writer</label> <input type="text" class="form-control" id="writer" name="writer"> </div> <button type="submit" class="btn btn-default">등록</button> <button type="reset" class="btn btn-default">취소</button> </form> </div> <div class="panel-footer"></div> </div> </div> </body> </html>
- 게시글은 textarea 태그
'Web > Spring' 카테고리의 다른 글
스프링 핵심 원리 (1) - 예제 순수 자바 to 스프링 컨테이너 (0) 2023.08.16 나프 - 게시판 만들기 (3) (0) 2023.08.03 나프 - 게시판 만들기(1) (0) 2023.08.02 Spring MVC02 - 다중파일 업로드 (0) 2023.06.30 Spring MVC02 - Ajax MemberList (0) 2023.06.29