[스프링부트] 글 목록 보기 DTO 만들기

익명 블로그 V1 - 9

Nov 18, 2024

Contents

[익명 게시글을 쓰는 블로그 만들기 9]BoardResponce 클래스 - DTO 클래스 생성 BoardController 클래스 - 매핑 BoardService 클래스 - 게시글목록보기() 메소드 list.mustache 파일 - 게시글 목록 보기 View 웹에서 실행

[익명 게시글을 쓰는 블로그 만들기 9]

BoardResponce 클래스 - DTO 클래스 생성

@Data(롬복 이용) : getter, setter 다 포함돼있음

static이라 접근 다 가능해서 바로 new 할 수 있음 ⇒ BoardResponce.DTO

글 목록에 띄울 글 번호와 제목만 가져와서 필드로 선언

생성자의 매개 변수로 Board 이용해서 깊은 복사 ⇒ Board 클래스의 모든 것을 들고 옴


package com.example.blog.Board;

import lombok.Data;

import java.sql.Timestamp;

public class BoardResponce {

    
    @Data // getter,setter 다 포함돼있음
    public static class DTO { // static이라서 바로 new 할 수 있음 => BoardResponce.DTO
        private int id; // 게시글 번호
        private String title; // 게시글 제목

        // 생성자
        // 깊은 복사를 위해 Board를 매개 변수로 이용 => Board의 모든 것을 들고옴
        public DTO(Board board) {
            this.id = board.getId();
            this.title = board.getTitle();
        }
    }
}

BoardController 클래스 - 매핑

Model을 파라미터에 넣고 GetMapping에 활용 ⇒ DS

request객체를 model이라는 객체로 랩핑(포장)해서 전달

Board 클래스의 정보를 넣는 List를 활용하는 것 보다 DTO 클래스를 만들어서 DTO의 정보를 넣는 List로 바꾸면 코드가 깔끔해짐

게시글 목록 띄우기에 꼭 필요한 정보만 들고 올 수 있기 때문


package com.example.blog.Board;

import lombok.RequiredArgsConstructor;
import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.PathVariable;

import java.util.List;

@RequiredArgsConstructor // final이 붙어있는 필드에 대한 생성자를 만들어줌
@Controller
public class BoardController {

    private final BoardService boardService;

    @GetMapping("/") // get 요청
    public String list(Model model) { // DS(request객체를 model이라는 객체로 랩핑(포장)해서 전달)

        // BoardResponce 클래스 안의 DTO 클래스에 게시글 번호와 제목만 필드를 넣어놓고
        // BoardService와 BoardController에 활용
        List<BoardResponce.DTO> boardList = boardService.게시글목록보기();
        model.addAttribute("models", boardList);

        // 파일명만 적어놓으면 view resolver가 .mustache파일을 templates에서 찾아냄
        return "list"; // view
    }
}

BoardService 클래스 - 게시글목록보기() 메소드

Board 클래스의 정보를 담는 boardList를 순회해서 깊은 복사(deep copy)

게시글 목록 보기에 필요한 정보만 선언해둔 DTO 클래스의 필드를 DTO 클래스의 정보를 담고있는 dtos 리스트에 추가


package com.example.blog.Board;

import lombok.RequiredArgsConstructor;
import org.springframework.stereotype.Service;

import java.util.ArrayList;
import java.util.List;

@RequiredArgsConstructor // final이 붙어있는 필드에 대한 생성자를 만들어줌
@Service
public class BoardService {

    private final BoardRepository boardRepository;

    public List<BoardResponce.DTO> 게시글목록보기() {

        // BoardResponce 클래스의 static 클래스 DTO라서 BoardResponce.DTO로 가져올 수 있음
        List<BoardResponce.DTO> dtos = new ArrayList<>();

        List<Board> boardList = boardRepository.findAll();

        // boardList를 순회해서 DTO 클래스의 필드(필요한 정보만 선언해둠)를 dtos 리스트에 add
        // => 깊은 복사
        for (Board board : boardList) {
            BoardResponce.DTO dto = new BoardResponce.DTO(board);
            dtos.add(dto);
        }
        return dtos;
    }
}

list.mustache 파일 - 게시글 목록 보기 View

{{ }} : java jsp에서의 el(${})과 같음

#순회할대상 : mustache파일에서의 for-each문, 이 경우 models를 순회

models는 BoardController에서 지정한 request의 키값(순회할 게시글List)

{{ }}로 표의 바디에 게시글의 번호와 제목을 들고옴


<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>blog</title>
</head>
<body>

<nav> <!-- 헤더가 네비게이션 역할을 할거니까 -->
    <ul> <!-- 헤더 -->
        <li>
            <a href="#">홈</a>
        </li>
        <li>
            <a href="#">글쓰기</a>
        </li>
    </ul>
</nav>

<hr> <!-- 줄긋기 -->

<section>
    <!-- 표 -->
    <table border="1"> <!-- border로 테두리 설정 -->
        <tr>
            <!-- 표의 헤더 -->
            <th>번호</th>
            <th>제목</th>
        </tr>

        <!-- #순회할대상 : mustache파일에서의 for-each문, 이 경우 models를 순회 -->
        <!-- models는 BoardController에서 지정한 request의 키값(순회할 게시글List) -->
        <!-- 겹중괄호는 java jsp에서의 el(${})과 같음 -->
        {{#models}}
        <tr>
            <!-- 표의 바디 -->
            <td>{{id}}</td> <!-- 게시글 번호 가져오기 -->
            <td>{{title}}</td> <!-- 게시글 제목 가져오기 -->
            <!-- 상세보기를 클릭하면 해당 글의 id에 맞는 정보가 담겨진 상세보기 화면이 보여짐 -->
            <td><a href="/board/{{id}}">상세보기</a></td>
        </tr>
        {{/models}}
    </table>
</section>

</body>
</html>

웹에서 실행