페이지 리스트로 만들기
1. 게시글을 불러올 메소드 생성
public List<Board> boardList(){
return boardRepository.findAll();
}
서비스 계층에서 데이터 베이스에 저장된 게시글 목록을 다 가져오는 메소드를 작성해준다.
2. 서비스에서 생성한 리스트를 불러와서 반환
@GetMapping("/board/list")
public String boardList(Model model){
//서비스에서 생성한 리스트를 list라는 이름으로 반환하겠다.
model.addAttribute("list", boardService.boardList());
return "boardlist";
}
서비스 계층에서 만든 로직은 컨트롤러에서 사용되며 이때, 컨트롤러는 가져온 목록을 모두 리스트에 넣어 Model에 담아 view로 반환해준다.
list라는 이름으로 찾은 모든 데이터를 리스트로 만들어 보낸다.
3.컨트롤러에서 반환 받은 리스트를 화면에 출력
model을 통해서 컨트롤러가 뷰로 데이터를 넘겨주면 뷰에서는 데이터를 받아와서 처리하는 작업은 타임리프로 진행한다.
[타임리프를 사용하기에 앞서..]
<html xmlns:th="http://www.thymeleaf.org">
타임리프를 사용하겠다는 의미로 html 파일 html 시작 테그에 넣어주어야 한다.[고정 화면 출력]
<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="UTF-8">
<title>게시글 리스트 페이지</title>
</head>
<style>
.layout {
width: 500px;
margin: 0 auto;
margin-top: 40px;
}
</style>
<body>
<div class="layout">
<table>
<thead>
<tr>
<th>글번호</th>
<th>제목</th>
</tr>
</thead>
<tbody>
<tr>
<td>1</td>
<td>제목입니다.</td>
</tr>
</tbody>
</table>
</div>
</body>
</html>
해당 작업에 정적인 고정 자료를 보여줄 땐 화면이 이렇게 출력된다.
[타임리프를 사용한 화면 출력]
<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="UTF-8">
<title>게시글 리스트 페이지</title>
</head>
<style>
.layout {
width: 500px;
margin: 0 auto;
margin-top: 40px;
}
</style>
<body>
<div class="layout">
<table>
<thead>
<tr>
<th>글번호</th>
<th>제목</th>
</tr>
</thead>
<tbody>
<tr th:each = "board:${list}">
<td th:text="${board.id}">1</td>
<td th:text="${board.title}">제목입니다.</td>
</tr>
</tbody>
</table>
</div>
</body>
</html> 
👽 해당 작업에 앞서서 본인은 DB에 데이터를 121개 생성해주고 진행했기 때문에 지금 화면 출력이 이렇게 나오는 것임을 말씀드립니다.
<th: each = "board:${list}">
// board라는 이름으로 각각의 리스트 요소를 하나씩 접근한다.
// 만약 a:${list}였다면 a라는 이름으로 각각의 리스트 요소를 하나씩 접근하는 것이다다음 포스팅은?
현 프로젝트 완성 시점까지 게시글의 상세 페이지를 볼 수 없기에 다음 포스팅에 상세페이지까지 볼 수 있게 할 예정이다.
즐겁고 괴로운 개발😎