< 수업 순서 - 2024.10.02 >
⭐Thymeleaf : 서버에서 HTML 문서 또는 XML 문서를 생성하여 제공하는 Server Side Tamplate Engine - Spring Boot에서 권장
-
장점 : 서버를 실행하지 않아도 HTMl 문서가 브라우저로 실행됨
-
JSP는 서버가 실행되어야 서블릿로 바뀌어서 HTMl 문서를 만들어 응답 처리
-
단점 : JSP 태그 및 커스텀 태그(JSTL)를 사용할 수 없어 코드의 재사용 불가능 - JavaScript 사용하여 단점 커버 가능
-
ttp://www.thymeleaf.org 블로그 사이트 참고하여 공부 - https://www.thymeleaf.org/doc/tutorials/3.1/usingthymeleaf.html 사용방법
01. TymeleafController
- text 값 전달하는 요청 처리 메소드 작성
02. result.html : text 값 전달
-
Tymeleaf 사용 : HTML 문서에 th 네임스페이스를 추가해야만 사용 가능
-
text 속성 : 변경될 태그내용을 ${속성명} 형식으로 표현해 요청 처리 메소드에서 제공된 Scope 속성값으로 태그 내용 변경
- [[${속성값}]] 인라인 표현식으로도 가능하지만 web Browser로 실행시 ⬇️아래와 같이 출력 - 비권장
- utext 속성 : 속성값으로 태그내용을 변경하기 위한 속성이며 html 태그가 포함되어 있는 경우 html 태그로 출력 처리
→ model.addAttribute("dataTwo", "Hi, Thymeleaf!!!");
03. xyz.itwill.boot.dto 패키지 생성
04. User DTO 생성
05. ThymeleafController 수정
- user 객체에 필드값 빌드하여 view에 전달
06. result.html 수정
-
변수 표현식을 사용해 Scope 속성값으로 객체를 제공받아 필드값으로 Thymeleaf 속성으로 사용
-
출력
07. application.properties 수정
- spring.messages.basename=message 추가 : 기초가 되는 message 파일
08. messages.properties 생성
09. result.html
< 수업 순서 - 2024.10.04 >
01. ThymeleafController 수정
- /control 페이지 실행 시 요청 처리 메소드 작성
02. control.html
-
if 속성 : 속성값이 [true]인 경우 태그를 사용하기 위한 Thymeleaf 속성
→ 속성값으로 false 또는 true 중 하나를 제공하기 위한 조건식 작성
-
M이면 남자, W면 여자 출력
-
unless 속성 : 속성값이 false 인 경우 태그 사용
-
block 태그 : 별도의 HTML 태그를 사용하지 않고 each 속성 또는 if 속성 등을 하용하기 위한 Thymeleaf 태그
-
swith 속성 : 값을 비교하여 태그를 선택하용하기 위한 속성
-
case 속성 : switch 속성값과 값을 비교해 같은 경우 태그를 사용하기 위한 Thymeleaf 속성
-
case 속성값으로 [*]를 설정한 경우 dafalt와 동일한 기능 제공
-
-
each 속성 : 태그를 반복 처리하기 위한 Thymeleaf 속성
-
속성값으로 [Scope 속성명 : List 객체]로 설정하여 List 객체의 요소값을 차례대로 Scope 속성명의 속성값으로 제공받아 반복 처리
-
03. fragment.html
-
fragment 속성 : 다른 HTML 문서에 태그를 제공하기 위한 Thymeleaf 속성
-
header, content, footer 생성
-
header, footer 중복 시 fragment로 생성하여 태그를 불러다가 사용
-
replace 속성 : fragment 속성으로 설정된 태그를 제공받아 태그를 변경하는 Thymeleaf 속성
-
~{ HTML 문서 경로 :: Fragment 식별자} 형식으로 태그를 제공를 제공받아 변경
-
layout html의 header와 footer fragment를 가져다가 쓰겠다는 의미
-
04. layout.html
- style 태그 자체를 조각으로 생성
- header와 footer도 조각으로 생성
05. build.gradle
- thymeleaf-layout-dialect dependency 빌드 처리
※ 빌드 처리가 되지 않을 때
06. template.html
- layout namespace 추가
07. ThymeleafController(수정)
- content1, content2 요청 처리 메소드 작성
08. content1.html
- decorate 속성 : 응답 처리될 템플릿 페이지의 HTML 문서의 파일을 설정
-
template.html이 갖는 태그를 응답 처리
-
