스프링부트 여름방학 9주차

 



 

부트스트랩 css 파일을 가져와서 적용시켜준 모습. html만을 사용하여 디자인한 화면보다 더 깔끔하게 디자인 가능하다. 

파일을 적용할때 가급적 sbb 안에서 부트스트랩 파일은 열지 않는다. 대용량 파일이라 열었을 떄 오류가 발생할 수 있다. 

(따라서 파일 경로에서 붙여넣기로 적용해준다)

 

 

화면과 같이 답변 기능을 만들기 위해, 상세 페이지 템플릿인  문제_디테일 html파일에 폼, 텍스트 영역, 인풋 요소를 추가해준다.

 

 등록 버튼으로 전송되는 폼의 기능은 타임리프의 th:action 속성을 이용해준다

 

question.id url 이 아직 매핑되지 않은 상태이므로 답변 컨트롤러에서 이를 매핑해준다.

 

@postMapping 이너테이션은일반 매필과 같은 역할을 하지만,  post 요청을 처리하는 경우에 사용한다.

create answer 매서드의 매개변수에는 @requestparam 가 추가되어있다 이는 템플릿에서 답변으로 입력한 내용을 얻기 위함이다. 

 

템플릿 내용에 해당하는 text area 의 name 속성이 content 이므로 변수명을 content 로 사용해준다.

 

답변을 저장하기 위해 answer 패키지 속에 answer service 파일을 만들어준다. 

 

 

답변 생성을 위해 create 매서드를 추가했다. 이 매서드는 입력받은 매개변수 question과 content 를 사용해 anwer 객체를 생성한다. 

this.answerService.create(question, content);

 문장을 중간에 삽입해 create 매서드를 사용할 수 있도록 해준다.

 

이제 저장된 답변이 화면에 출력되도록 해보자

 

question_detail 파일에 

 

를 작성해준다.

 

#lists.size 는 답변의 개수를 확인 할 수 있도록 해주는 함수다.

div 태그로 요수들을 묶어준 다음에 리스트로 목록을 묶어 입력한 답변이 목록 형식으로 보여질 수 있도록 했다.