게시판 프로젝트

plugins { id 'java' id 'war' id 'org.springframework.boot' version '3.5.9' id 'io.spring.dependency-management' version '1.1.7' } group = 'com.aloha' version = '0.0.1-SNAPSHOT' description = '게시판 프로젝트' java { toolchain { languageVersion = JavaLanguageVersion.of(23) } } configurations { compileOnly { extendsFrom annotationProcessor } } repositories { mavenCentral() } dependencies { implementation 'org.springframework.boot:spring-boot-starter-thymeleaf' implementation 'org.springframework.boot:spring-boot-starter-web' implementation 'org.mybatis.spring.boot:mybatis-spring-boot-starter:3.0.5' compileOnly 'org.projectlombok:lombok' developmentOnly 'org.springframework.boot:spring-boot-devtools' runtimeOnly 'com.mysql:mysql-connector-j' annotationProcessor 'org.projectlombok:lombok' providedRuntime 'org.springframework.boot:spring-boot-starter-tomcat' testImplementation 'org.springframework.boot:spring-boot-starter-test' testImplementation 'org.mybatis.spring.boot:mybatis-spring-boot-starter-test:3.0.5' testRuntimeOnly 'org.junit.platform:junit-platform-launcher' // log4j2 로깅 라이브러리 // implementation 'org.bgee.log4jdbc-log4j2:log4jdbc-log4j2-jdbc4.1:1.16' // P6Spy 로깅 라이브러리 implementation 'p6spy:p6spy:3.9.1' } tasks.named('test') { useJUnitPlatform() }

spring.application.name=board # 데이터 소스 - MySQL # 기본 데이터 소스 # spring.datasource.driver-class-name=com.mysql.cj.jdbc.Driver # spring.datasource.url=jdbc:mysql://127.0.0.1:3306/aloha?serverTimezone=Asia/Seoul&allowPublicKeyRetrieval=true&useSSL=false&autoReconnection=true&autoReconnection=true # log4j2 # spring.datasource.driver-class-name=net.sf.log4jdbc.sql.jdbcapi.DriverSpy # spring.datasource.url=jdbc:log4jdbc:mysql://localhost:3306/aloha?serverTimezone=Asia/Seoul&allowPublicKeyRetrieval=true&useSSL=false&autoReconnection=true&autoReconnection=true # p6spy spring.datasource.driver-class-name=com.p6spy.engine.spy.P6SpyDriver spring.datasource.url=jdbc:p6spy:mysql://localhost:3306/aloha?serverTimezone=Asia/Seoul&allowPublicKeyRetrieval=true&useSSL=false&autoReconnection=true&autoReconnection=true spring.datasource.username=aloha spring.datasource.password=123456 # Mybatis 설정 # Mybatis 설정 경로 : ~/resources/mybatis-config.xml # mybatis.config-location=classpath:mybatis-config.xml # 컬럼명을 변수명으로 자동매핑 : board_no ➡ boardNo mybatis.configuration.map-underscore-to-camel-case=true # resultType 속성에서 dto 객체 (패키지.클래스명) ➡ (클래스명) mybatis.type-aliases-package=com.aloha.board.dto # Mybatis 매퍼 파일 경로 : ~/메인패키지/mapper/**Mapper.xml mybatis.mapper-locations=classpath:mybatis/mapper/**/**.xml # 로그 레벨 설정 # level : TRACE, DEBUG, INFO, WARN, ERROR logging.level.com.aloha.board=INFO # logging.level.com.aloha.board.mapper=INFO # ANSI 컬러 출력 설정 spring.output.ansi.enabled=ALWAYS

# P6Spy에서 사용할 모듈(로그 팩토리) 지정 # SQL 실행 정보를 수집하여 로그로 출력하는 핵심 모듈 modulelist=com.p6spy.engine.logging.P6LogFactory # SQL 로그 출력 포맷 지정 # MultiLineFormat → 줄바꿈 + 들여쓰기 된 가독성 좋은 SQL 로그 출력 logMessageFormat=com.p6spy.engine.spy.appender.MultiLineFormat # 로그 출력 방식 지정 # Slf4JLogger → SLF4J를 통해 logback / log4j2 설정을 그대로 사용 appender=com.p6spy.engine.spy.appender.Slf4JLogger

-- 데이터베이스 생성 CREATE DATABASE IF NOT EXISTS aloha;

-- 외래키 무시 SET FOREIGN_KEY_CHECKS=0; DROP TABLE IF EXISTS board; -- 게시판 테이블 생성 CREATE TABLE `board` ( `no` int NOT NULL AUTO_INCREMENT PRIMARY KEY, `id` varchar(64) DEFAULT NULL UNIQUE, `title` varchar(100) NOT NULL, `writer` varchar(100) NOT NULL, `content` text, `created_at` timestamp NULL DEFAULT CURRENT_TIMESTAMP, `updated_at` timestamp NULL DEFAULT CURRENT_TIMESTAMP ON UPDATE CURRENT_TIMESTAMP ); -- 샘플 데이터 TRUNCATE Table board; INSERT INTO board (id, title, writer, content) VALUES ( UUID(), '제목1', '작성자1', '내용1'), ( UUID(), '제목2', '작성자2', '내용2'), ( UUID(), '제목3', '작성자3', '내용3'), ( UUID(), '제목4', '작성자4', '내용4'), ( UUID(), '제목5', '작성자5', '내용5') ; -- 외래키 활성화 SET FOREIGN_KEY_CHECKS=1;

@Data public class Board { private Integer no; private String id; private String title; private String writer; private String content; private Date createdAt; private Date updatedAt; public Board() { this.id = UUID.randomUUID().toString(); } }

<?xml version="1.0" encoding="UTF-8"?> <!DOCTYPE mapper PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN" "http://mybatis.org/dtd/mybatis-3-mapper.dtd"> <!-- namespace="매퍼 인터페이스 경로" --> <mapper namespace="com.aloha.board.mapper.BoardMapper"> <!-- 게시글 목록 --> <!-- <select id="list" resultType="com.aloha.mybatis.dto.Board"> --> <select id="list" resultType="Board"> SELECT * FROM board ORDER BY created_at DESC </select> <!-- 게시글 조회 --> <select id="select" resultType="Board"> SELECT * FROM board WHERE no = #{no} </select> <!-- 게시글 등록 --> <insert id="insert"> INSERT INTO board ( id, title, writer, content ) VALUES ( #{id}, #{title}, #{writer}, #{content} ) </insert> <!-- 게시글 수정 --> <update id="update"> UPDATE board SET title = #{title} ,writer = #{writer} ,content = #{content} WHERE no = #{no} </update> <!-- 게시글 삭제 --> <delete id="delete"> DELETE FROM board WHERE no = #{no} </delete> </mapper>

@Mapper public interface BoardMapper { // 게시글 목록 List<Board> list() throws Exception; // 게시글 조회 Board select(Integer no) throws Exception; // 게시글 등록 int insert(Board board) throws Exception; // 게시글 수정 int update(Board board) throws Exception; // 게시글 삭제 int delete(Integer no) throws Exception; }

public interface BoardService { // 게시글 목록 List<Board> list() throws Exception; // 게시글 조회 Board select(Integer no) throws Exception; // 게시글 등록 boolean insert(Board board) throws Exception; // 게시글 수정 boolean update(Board board) throws Exception; // 게시글 삭제 boolean delete(Integer no) throws Exception; }

@Service @RequiredArgsConstructor public class BoardServiceImpl implements BoardService { private final BoardMapper boardMapper; @Override public List<Board> list() throws Exception { List<Board> list = boardMapper.list(); return list; } @Override public Board select(Integer no) throws Exception { Board board = boardMapper.select(no); return board; } @Override public boolean insert(Board board) throws Exception { int result = boardMapper.insert(board); return result > 0; } @Override public boolean update(Board board) throws Exception { int result = boardMapper.update(board); return result > 0; } @Override public boolean delete(Integer no) throws Exception { int result = boardMapper.delete(no); return result > 0; } }

/** * [GET] - /board/list : 게시글 목록 화면 * [GET] - /board/detail : 게시글 조회 화면 * [GET] - /board/create : 게시글 등록 화면 * [POST] - /board/create : 게시글 등록 처리 * [GET] - /board/updatee : 게시글 수정 화면 * [POST] - /board/update : 게시글 수정 처리 * [POST] - /board/delete : 게시글 삭제 처리 */ @Slf4j // 로그 어노테이션 @Controller // 컨트롤러 빈으로 등록 @RequestMapping("/board") // 클레스 레벨 요청 경로 매핑 @RequiredArgsConstructor public class BoardController { private final BoardService boardService; /** * 게시글 목록 화면 * @param model * @return * @throws Exception */ @GetMapping("/list") public String list(Model model) throws Exception { // 데이터 요청 List<Board> list = boardService.list(); // 모델 등록 model.addAttribute("list", list); // 뷰 지정 return "board/list"; } /** * 게시글 조회 화면 * - /board/detail?no=💎 * @param no * @param model * @return * @throws Exception */ @GetMapping("/detail") public String detail( @RequestParam("no") Integer no, Model model ) throws Exception { // 데이터 요청 Board board = boardService.select(no); // 모델 등록 model.addAttribute("board", board); // 뷰 지정 return "board/detail"; } /** * 게시글 등록 화면 * @return */ @GetMapping("/create") public String create() { return "board/create"; } /** * 게시글 등록 처리 * @param board * @return * @throws Exception */ @PostMapping("/create") public String create(Board board) throws Exception { // 데이터 요청 boolean result = boardService.insert(board); // 리다이렉트 // ⭕ 데이터 처리 성공 if( result ) return "redirect:/board/list"; // ❌ 데이터 처리 실패 return "redirect:/board/create?error"; } /** * 게시글 수정 화면 * @param no * @param model * @return * @throws Exception */ @GetMapping("/update") public String update( @RequestParam("no") Integer no, Model model ) throws Exception { Board board = boardService.select(no); model.addAttribute("board", board); return "board/update"; } /** * 게시글 수정 처리 * @param board * @return * @throws Exception */ @PostMapping("/update") public String update(Board board) throws Exception { boolean result = boardService.update(board); if( result ) return "redirect:/board/list"; int no = board.getNo(); return "redirect:/board/update?no=" + no + "&error"; } /** * 게시글 삭제 처리 * @param no * @return * @throws Exception */ @PostMapping("/delete") public String delete(@RequestParam("no") Integer no) throws Exception { boolean result = boardService.delete(no); if( result ) return "redirect:/board/list"; return "redirect:/board/update?no=" + no + "&error"; } }

@Slf4j @Controller public class HomeController { @GetMapping("/") public String home() { log.info("메인 화면"); return "index"; } }

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>메인화면</title> <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.8/dist/css/bootstrap.min.css" rel="stylesheet"> <link rel="stylesheet" href="/css/style.css"> </head> <body> <main> <div class="px-4 py-5 my-5 text-center"> <img class="d-block mx-auto mb-4" src="/img/logo.png" alt="" width="100" height="100"> <h1 class="display-5 fw-bold text-body-emphasis">게시판 프로젝트</h1> <div class="col-lg-6 mx-auto"> <p class="lead mb-4"> <ol class="list-group list-group-numbered"> <li class="list-group-item">Spring Boot</li> <li class="list-group-item">MySQL</li> <li class="list-group-item">MyBatis</li> <li class="list-group-item">Thymeleaf</li> <li class="list-group-item">Bootstrap</li> </ol> </p> <div class="d-grid gap-2 d-sm-flex justify-content-sm-center"> <a href="/board/list" class="btn btn-primary btn-lg px-4 gap-3">게시판</a> <a href="/board/create" class="btn btn-outline-secondary btn-lg px-4">등록하기</a> </div> </div> </div> </main> <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.8/dist/js/bootstrap.bundle.min.js"></script> </body> </html>

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>게시판 프로젝트</title> <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.8/dist/css/bootstrap.min.css" rel="stylesheet"> <link rel="stylesheet" href="/css/style.css"> </head> <body> <main> <div class="container py-5"> <div class="row justify-content-center"> <div class="col-12"> <h1 class="text-center">게시글 목록</h1> <div class="d-flex justify-content-end"> <a href="/board/create" class="btn btn-primary">글쓰기</a> </div> <table class="table table-bordered table-striped table-hover table-responsive mt-3 text-center"> <colgroup> <col class="col-1"> <!-- 번호 --> <col class="col-3"> <!-- 제목 --> <col class="col-2"> <!-- 작성자 --> <col class="col-2"> <!-- 등록일자 --> <col class="col-2"> <!-- 수정일자 --> </colgroup> <tr class="table-dark"> <th width="150">번호</th> <th width="300">제목</th> <th>작성자</th> <th>등록일자</th> <th>수정일자</th> </tr> <th:block th:if="${ list == null || list.isEmpty() }"> <tr> <td colspan="5">조회된 데이터가 없습니다.</td> </tr> </th:block> <th:block th:each="board : ${list}"> <tr class="align-middle"> <td th:text="${board.no}">번호</td> <td class="text-start"> <a th:href="|/board/detail?no=${board.no}|" th:text="${board.title}">제목</a> </td> <td th:text="${board.writer}">작성자</td> <td> <span th:text="${ #dates.format( board.createdAt, 'yyyy-MM-dd HH:mm:ss' ) }"> 등록일자 </span> </td> <td> <span th:text="${ #dates.format( board.updatedAt, 'yyyy-MM-dd HH:mm:ss' ) }"> 수정일자 </span> </td> </tr> </th:block> </table> </div> </div> </div> </main> <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.8/dist/js/bootstrap.bundle.min.js"></script> </body> </html>

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>게시판 프로젝트</title> <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.8/dist/css/bootstrap.min.css" rel="stylesheet"> <link rel="stylesheet" href="/css/style.css"> </head> <body> <main> <div class="container py-5"> <div class="row justify-content-center"> <div class="col-12 col-md-10 col-lg-6"> <h1 class="text-center">게시글 등록</h1> <form action="/board/create" method="post"> <div class="mb-3"> <label for="" class="form-label">제목</label> <input type="text" class="form-control" name="title" id="title" aria-describedby="helpTitle" placeholder="제목을 입력해주세요" /> <small id="helpTitle" class="form-text text-muted">제목을 입력해주세요</small> </div> <div class="mb-3"> <label for="" class="form-label">작성자</label> <input type="text" class="form-control" name="writer" id="writer" aria-describedby="helpWriter" placeholder="작성자를 입력해주세요" /> <small id="helpWriter" class="form-text text-muted">작성자를 입력해주세요</small> </div> <div class="mb-3"> <label for="" class="form-label">내용</label> <textarea class="form-control" name="content" id="content" rows="5"></textarea> </div> <div class="d-grid gap-2"> <button type="submit" class="btn btn-primary">등록</button> </div> </form> </div> </div> </div> </main> <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.8/dist/js/bootstrap.bundle.min.js"></script> </body> </html>

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>게시판 프로젝트</title> <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.8/dist/css/bootstrap.min.css" rel="stylesheet"> <link rel="stylesheet" href="/css/style.css"> </head> <body> <main> <div class="container py-5"> <div class="row justify-content-center"> <div class="col-12 col-md-10 col-lg-6"> <h1 class="text-center">게시글 조회</h1> <form action="/board/create" method="post" th:object="${board}"> <div class="mb-3"> <label for="" class="form-label">제목</label> <input type="text" class="form-control" th:field="*{title}" aria-describedby="helpTitle" placeholder="제목을 입력해주세요" readonly /> </div> <div class="mb-3"> <label for="" class="form-label">작성자</label> <input type="text" class="form-control" th:field="*{writer}" aria-describedby="helpWriter" placeholder="작성자를 입력해주세요" readonly /> </div> <div class="mb-3"> <label for="" class="form-label">내용</label> <textarea class="form-control" th:field="*{content}" rows="5" readonly></textarea> </div> <div class="d-grid gap-2 d-md-flex justify-content-center"> <button type="button" class="btn btn-outline-primary w-100" onclick="moveList()">목록</button> <button type="button" class="btn btn-primary w-100" onclick="moveUpdate()">수정</button> </div> </form> </div> </div> </div> </main> <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.8/dist/js/bootstrap.bundle.min.js"></script> <script> // 👩‍💻 모델 객체를 자바스크립트로 가져오는 방법 let no = '[[${board.no}]]' // 목록 화면 이동 function moveList() { location.href = '/board/list' } // 수정 화면 이동 function moveUpdate() { location.href = '/board/update?no=' + no } </script> </body> </html>

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>게시판 프로젝트</title> <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.8/dist/css/bootstrap.min.css" rel="stylesheet"> <link rel="stylesheet" href="/css/style.css"> </head> <body> <main> <div class="container py-5"> <div class="row justify-content-center"> <div class="col-12 col-md-10 col-lg-6"> <h1 class="text-center">게시글 수정</h1> <form id="form" action="/board/update" method="post" th:object="${board}"> <input type="hidden" th:field="*{no}"> <div class="mb-3"> <label for="" class="form-label">제목</label> <input type="text" class="form-control" th:field="*{title}" aria-describedby="helpTitle" placeholder="제목을 입력해주세요" /> </div> <div class="mb-3"> <label for="" class="form-label">작성자</label> <input type="text" class="form-control" th:field="*{writer}" aria-describedby="helpWriter" placeholder="작성자를 입력해주세요" /> </div> <div class="mb-3"> <label for="" class="form-label">내용</label> <textarea class="form-control" th:field="*{content}" rows="5"></textarea> </div> <div class="d-grid gap-2 d-md-flex justify-content-center mt-2"> <button type="submit" class="btn btn-primary w-100">수정</button> </div> <div class="d-grid gap-2 d-md-flex justify-content-center mt-2"> <button type="button" class="btn btn-outline-primary w-100" onclick="moveList()">목록</button> <button type="button" class="btn btn-outline-danger w-100" onclick="actionDelete()">삭제</button> </div> </form> </div> </div> </div> </main> <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.8/dist/js/bootstrap.bundle.min.js"></script> <script> // 👩‍💻 모델 객체를 자바스크립트로 가져오는 방법 let no = '[[${board.no}]]' // 폼 let $form = document.getElementById("form") // 목록 화면 이동 function moveList() { location.href = '/board/list' } // 삭제 요청 function actionDelete() { let check = confirm('정말로 삭제하시겠습니까?') if( check ) { $form.action = '/board/delete' $form.submit() } } </script> </body> </html>