코드로 배우는 스프링부트 웹 프로젝트 Day 9

Spring/코드로 배우는 스프링부트 웹 프로젝트

코드로 배우는 스프링부트 웹 프로젝트 Day 9

한 면만 쓴 종이 2022. 8. 24. 16:39

/* Annotation들은 스프링부트 프로젝트의 Annotation 정리 페이지에 따로 정리해두었습니다. */

[등록 페이지의 링크와 조회 페이지 링크 처리]

지금까지는 글을 등록하기 위해 직접 /guestbook/register 링크에 들어가서 등록해야했다.

이제 새로운 글을 등록할 수 있는 버튼을 만들 것이다.

그리고 목록의 각 글의 번호나 제목을 클릭하면 조회 페이지로 이동하도록 처리할 것이다.

list.html

<h1 class="mt-4">GuestBook List Page
    <span>
        <a th:href="@{/guestbook/register}">
            <button type="button" class="btn btn-outline-primary">REGISTER
            </button>
        </a>
    </span>
</h1>

이제 조회 페이지로 이동하고 다시 목록 페이지로 이동하도록 만들 것이다.

list.html

<tr th:each="dto : ${result.dtoList}" >
    <th scope="row">
        <a th:href="@{/guestbook/read(gno = ${dto.gno}, page= ${result.page})}">
            [[${dto.gno}]]
        </a>
    </th>
    <td>[[${dto.title}]]</td>
    <td>[[${dto.writer}]]</td>
    <td>[[${#temporals.format(dto.regDate, 'yyy/MM/dd')}]]</td>
</tr>

위처럼 gno에 링크를 걸어두고 이동하면 아래와 같이 적절한 gno와 page의 값을 가진 링크로 이동하게 된다.

[방명록의 조회 처리]

방명록의 조회는 GuestbookService에도 아직 구현되어있지 않은 상태이다.

따라서 서비스 계층부터 구현한다.

GuestbookService 인터페이스

public interface GuestbookService {
    Long register(GuestbookDTO dto);
    GuestbookDTO read(Long gno);
    ```
}

read() 메서드를 추가한다.

추가한 메서드를 GuestbookServiceImpl 클래스에서 구현한다.

GuestbookServiceImpl 클래스

@Override
public GuestbookDTO read(Long gno) {
    
    Optional<Guestbook> result = repository.findById(gno);
    
    return result.isPresent()? entityToDto(result.get()): null;
}

리턴 타입을 GuestbookDTO로 해서, gno를 이용해 findById로 엔티티 객체를 가져와서 그 값이 있다면 엔티티 객체를 DTO로 바꿔서 반환하고 없을 경우 null을 반환하도록 함

GuestbookController 클래스

@GetMapping("/read")
public void read(long gno, @ModelAttribute("requestDTO") PageRequestDTO requestDTO, Model model) {
    
    log.info("gno: " + gno);
    
    GuestbookDTO dto = service.read(gno);
    
    model.addAttribute("dto" ,dto);
}

Get 방식으로 gno를 받아서, Model에 객체를 담아서 전달

목록 페이지로 돌아갈 것을 생각해서 PageRequestDTO를 파라미터로 사용

read.html

<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">

<th:block th:replace="~{/layout/basic :: setContent(~{this::content})}">

    <th:block th:fragment="content">

        <h1 class="mt-4">GuestBook Read Page</h1>

        <div class="form-group">
            <label>Gno</label>
            <input type="text" class="form-control" name="gno" th:value="${dto.gno}" readonly>
        </div>

        <div class="form-group">
            <label>Title</label>
            <input type="text" class="form-control" name="title" th:value="${dto.title}" readonly>
        </div>

        <div class="form-group">
            <label>Content</label>
            <textarea class="form-control" rows="5" name="content" readonly>[[${dto.content}]]</textarea>
        </div>

        <div class="form-group">
            <label>Writer</label>
            <input type="text" class="form-control" name="writer" th:value="${dto.writer}" readonly>
        </div>
        
        <div class="form-group">
            <label>RegDate</label>
            <input type="text" class="form-control" name="regDate" th:value="${#temporals.format(dto.regDate, 'yyy/MM/dd HH:mm:ss')}" readonly>
        </div>
        
        <div class="form-group">
            <label>ModDate</label>
            <input type="text" class="form-control" name="modDate" th:value="${#temporals.format(dto.modDate. 'yyyy/MM/dd HH:mm:ss')}" readonly>
        </div>
        
        <a href="@{/guestbook/modify(gno = ${dto.gno}, page=${requestDTO.page})}"><button type="button" class="btn btn-primary">Modify</button></a>
        
        <a href="@{/guestbook/list(page=${requestDTO.page})}}"><button type="button" class="btn btn-info">List</button></a>

    </th:block>
</th:block>

</html>

(button을 위와 띄우기 위해 <br> 삽입함)

DTO를 이용해서 글의 내용 출력

GuestbookController에서 @ModelAttribute로 처리한 requestDTO로 page를 처리