[Mustache & Spring] 전체 조회 화면 만들기

UI 변경

index.mustache에 게시글 목록을 나타낼 테이블 코드를 추가

{{>layout/header}}
<h1>스프링 부트로 시작하는 웹 서비스</h1>
<div class="col-md-12">
	<div class="row">
		<div class="col-md-6">
			<a href="/posts/save" role="button" class="btn btn-primary">글 등록</a>
		</div>
	</div>
	<br>
	<!-- 목록 출력 영역 -->
	<table class="table table-horizontal table-bordered">
		<thead class="thead-strong">
		<tr>
			<th>게시글 번호</th>
			<th>제목</th>
			<th>작성자</th>
			<th>최종 수정일</th>
		</tr>
		</thead>
		
		<tbody id="tbody">
		{{#posts}}	<!-- posts라는 list 순회 -->
			<tr>
				<td>{{id}}</td>	<!-- list에서 뽑아낸 객체의 필드 -->
				<td>{{title}}</td>
				<td>{{author}}</td>
				<td>{{modifiedDate}}</td>
			</tr>
		{{/posts}}
		</tbody>
	</table>
</div>
{{>layout/footer}}

 

Repostiory 수정

PostsRepository.interface 수정

public interface PostsRepository extends JpaRepository<Posts, Long>{
	@Query("SELECT p FROM Posts p ORDER BY p.id DESC")
	List<Posts> findAllDesc();
}

@Query

- SpringDataJpa에서 제공하지 않는 메소드를 쿼리로 작성

- 가독성 ↑

 

큰 프로젝트에서의 데이터 조회는 조인이나 복잡한 조건 등으로 인해 Entity 클래스만으로 처리하기 어려워진다.

이럴 때 querydsl, jooq, MyBatis 등의 조회용 프레임워크를 추가한다.

조회는 프레임워크를 통해, 등록/수정/삭제는 SpringDataJpa를 통해 진행한다.

 

Service 수정

PostsService.java 추가

...
	@Transactional(readOnly = true)
	public List<PostsListResponseDto> findAllDesc() {
		return postsRepository.findAllDesc().stream()
				.map(PostsListResponseDto::new)	// == .map(posts -> new PostsListResponseDto(posts))
				.collect(Collectors.toList());
	}
...

readOnly = true

- 트랜잭션 범위는 유지하되, 조회 기능만 남겨둬 조회 속도를 개선

- 등록/수정/삭제 기능이 전혀 없는 서비스 메소드에서 사용

 

Dto 생성

dto 폴더에 PostsListResponseDto 생성

@Getter
public class PostsListResponseDto {
	private Long id;
	private String title;
	private String author;
	private LocalDateTime modifiedDate;
	
	public PostsListResponseDto(Posts entity) {
		this.id 		= entity.getId();
		this.title 		= entity.getTitle();
		this.author 		= entity.getAuthor();
		this.modifiedDate 	= entity.getModifiedDate();
	}
}

 

Controller 수정

IndexController 변경

@RequiredArgsConstructor
@Controller
public class IndexController {
	private final PostsService postsService;
	
	@GetMapping("/")
	public String index(Model model) {
		model.addAttribute("posts", postsService.findAllDesc());
		return "index";
	}
...

 

이제 Application.java를 실행하고 locahost:8080을 접속하면 게시글 목록이 뜬다

1. WhiteLabel 오류

-> index 페이지를 못 찾는중. index.mustache 파일의 위치가 templates 폴더 안인지 확인할 것.

 

2. 게시글 목록 없음

-> db의 데이터가 없을 확률이 크다. h2에 접속해서 데이터가 있나 확인해볼 것.

---

해당 게시글은 [ 스프링 부트와 AWS로 혼자 구현하는 웹 서비스 / 이동욱 ] 책을 따라한 것을 정리하기 위한 게시글입니다. 요약, 생략한 부분이 많으니 보다 자세한 설명은 책 구매를 권장합니다.