7. 게시글 작성 구현

1. 페이지 구성

• 간단하게 게시글의 제목, 내용을 작성할 수 있는 페이지를 위와 같이 구성.

• section 위쪽에 적혀있는 내용들을 따로 템플릿 파일로 작성하여 활용한 모습.

{{> layout/header}} <!-- Mustache 템플릿 사용 -->

<section>
    <!-- 
        title=제목 & content=내용
        - Content-Type: application/x-www-form-urlencoded
        - key 값: input 태그의 name 속성
        - value 값: input 태그에 사용자가 입력하는 값
        - 아래는 POST 요청으로 게시글을 저장하는 1.0 방식
        - application/x-www-form-urlencoded은 기본값이며 명시하지 않아도 자동 적용
    -->
    <form action="/board/save" method="post" enctype="application/x-www-form-urlencoded">
        <input type="text" name="title" placeholder="제목"><br>
        <input type="text" name="content" placeholder="내용"><br>
        <button type="submit">글쓰기</button>
    </form>
</section>
</body>
</html>

부분 탬플릿?

• Mustache에서 재사용 가능한 템플릿 조각을 의미

• 코드의 재사용성과 유지 보수성 향상에 도움을 줌

2. Controller

@GetMapping("/board/save-form")
public String saveForm() {
    return "save-form";
}

@PostMapping("/board/save")
public void save(BoardRequest.SaveDTO saveDTO, HttpServletResponse response) {
    boardService.게시글쓰기(saveDTO);
    response.setStatus(302);
    response.setHeader("Location", "/");
}

• @PostMapping("/board/save"): /board/save 경로에 대한 HTTP POST 요청을 처리.

• public void save(BoardRequest.SaveDTO saveDTO, HttpServletResponse response): BoardRequest.SaveDTO 객체와 HttpServletResponse 객체를 매개변수로 받음.
• saveDTO: 클라이언트에서 전송된 게시글 데이터를 파싱한 객체.
• response: HTTP 응답을 설정할 수 있는 객체.

• boardService.게시글쓰기(saveDTO);
• boardService를 통해 게시글 저장 작업을 수행.
• saveDTO 객체에 담긴 데이터를 사용하여 새로운 게시글을 데이터베이스에 저장.

• response.setStatus(302);응답 상태 코드를 302 (Found)로 설정. 302는 리다이렉션 응답을 의미.

• response.setHeader("location", "/");
• Location 헤더를 설정하여 클라이언트를 루트 경로 (/)로 리다이렉트.
• 게시글 작성 후 메인 페이지로 리다이렉션하는 역할.

3. Service

@Transactional // 테스트 코드에서는 롤백을 해주고, 여기서는 커밋.
public void 게시글쓰기(BoardRequest.SaveDTO saveDTO) {
    boardRepository.save(saveDTO.getTitle(), saveDTO.getContent());
}

4. Repository :

public void save(String title, String content) {
    Query q = em.createNativeQuery("insert into board_tb(title, content, created_at) values(?, ?, now())");
    q.setParameter(1, title);
    q.setParameter(2, content);
    q.executeUpdate();
}

• executeUpdate()
• JPQL 또는 네이티브 SQL 쿼리를 실행하여 데이터베이스에서 데이터를 수정하거나 삽입, 삭제하는 메서드
• Service에서 트랜잭션이 활성화되어 있어야 데이터가 실제로 커밋이 동작

5.작성 내용 테스트하기