[Spring][16]Main Page[메인페이지, 상세페이지 구현]
BackEnd/Spring

[Spring][16]Main Page[메인페이지, 상세페이지 구현]

목차

-메인 페이지 구현

-최종 구현 코드

-Post 상세페이지 구현


메인 페이지 구현

 

블로그의 메인 페이지 구현을 위해서 

Bootstrap에 있는 것을 가져옵니다.

 

 

새로운 jsp파일도 만들어줍니다.

 

list.jsp

 

headerfooter를 추가해주고 Bootstrap을 복사 붙여 넣기 해줍니다.

 

 

 

새롭게 컨트롤러에도 list를 핸들링할 수 있게 PostController도 만들어줍니다.

 

 

이렇게 하면 양쪽 다 받아준다

 

 

이제 PostController

postRepositorysession DI합니다.

바로 세션에 model을 담아서 list에 보여주기 위해서입니다.

 

return post/list

 

list.jsp를 다듬어 줍니다.

 

list.jsp

 

구현되는 모습

 

구현되는 모습

 

list.jsp에서 아까 추가해준 PostController에서 model에 담아온 PostEntity를 

jstl을 사용하여 forEach문에 담아서 각각의 요소를 다 넣어서 순차적으로 보여줍니다.

 

forEach에 들어가는 var변수page Scope로 들어갑니다.

이 변수는 이 페이지에서만 쓸 수 있습니다.

 

var변수이 페이지(list.jsp)에서만 사용할 수 있는 변수입니다.

forEach로 각각의 postsEntity에 있는 post객체들이

각각의 변수로써 보여주게 됩니다.

 

post.title, post.id

 

이렇게 하면 postsEntity에서 있는 것을 하나씩 post에 넣어서

그 요소인 post.title, post.id을 보여줍니다.

 

*

Tips

Shift + Ctrl + ? -> 드래그만큼 주석

Shift + Ctrl + f -> 정렬

*

 


최종 구현 코드

 

list.jsp

list.jsp

 

forEach문 안에 있는 것들 중 postpostsEntity에 있는 것을 하나씩 담아서 돌립니다.

 

(forEach post : postsEntity)

지금 이 page에서는 varpost가 담겨 있습니다. page 변수로 담겨 있습니다.

그래서 이 페이지에서는 다른 곳에서 똑같은 post로 모델을 담아서 던져주면 그 값을 받지 못합니다.

굳이 받고 싶다면 requestScope를 사용하면 되지만 실제로 사용하지 않습니다.

 

 

 

 

PostController.java

PostController

 

 

구현되는 모습

 

PostEntity에 있는 post들

 

 


Post 상세페이지 구현

 

 

 

컨트롤러에 하나 추가합니다.

 

상세보기 버튼의 href의 url인 /post/{id}로 받아온다

 

detail.jsp를 다음과 같이 만들어줍니다 

 

postEntity의 user의 username!

 

주의할 점!

 

LAZY인 상태에 yml파일에 open-in-viewfalse로 되어있으면 되지가 않습니다.

그러나 LAZY인 상태에도 open-in-viewtrue이면 됩니다.

 

 

반면 EAGER일 경우 JPAopen-in-view false로 되어있어도 오류 없이 됩니다.

마찬가지로 JPAopen-in-viewtrue로 되어있어도 됩니다.

 

여기서는 효율을 위해서 EAGER로 합쳐서 받는 것보다 LAZY로 설정해두고

open-in-view의 영속성 콘텍스트의 생명주기를 View까지 끌고 오게 true로 해놓습니다.

 

그렇게 하면 훨쉰 효율적으로 요청할 때만 join을 해주게 되며 객체 안에 있는 값을 Mapping 하여 

보내주게 됩니다.

 

postEntity.user.username을 들고 올 수 있겠는가?

 

LAZY     open-in-view false   X

LAZY     open-in-view true    O

EAGER   open-in-view false    O

EAGER   open-in-view true     O

 

FetchType!
JPA 생명주기인 open-in-view 설정! 

 

구현되는 모습입니다.

각각의 요소들이 잘 들어가 있네요!

 

구현되는 모습