FireDrago
[Thymeleaf] 기능 - 템플릿 사용 본문
이전 포스팅에서 타임리프의 기본기능을 살펴봤다.
이번에는 웹페이지를 개발할때 공통영역 부분을 한 곳에서 처리할 수 있는 템플릿 조각과 레이아웃 기능을 알아보자
<템플릿 조각>
먼저 공통적으로 사용되는 코드 조각을 모아두는 html 을 하나 생성한다.

태그안에 th:fragment = "호출명" 을 설정해준다.
파라미터가 필요한 경우에는 th:fragment = "호출명 (파라미터)" 형식으로 설정 해줄 수 도 있다.
이제 해당태그를 다른 타임리프 파일에서 불러오는 코드를 살펴보자

1. th:insert
- th:insert 를 사용하면 현재 태그 내부에 호출 태그를 삽입한다. ~{경로 :: 호출명} 으로 호출한다.
경로가 단순한 경우 ~{} 를 생략하여 표현 할 수도 있다. (div 태그 안에 footer 생성)
2. th:replaece
- th:replace를 사용하면 현재 태그 대신 호출 태그를 삽입한다. (div 대신 footer로 변경)
3. 파라미터 사용
- 파라미터를 사용하는 호출태그의 경우 :: 호출명 (파라미터) 형식으로 호출한다.
<레이아웃>
템플릿 조각기능은 일부 태그를 가져와서 사용할 수 있는 기능이었다.
이번에는 레이아웃에 코드조각을 넘겨서 형식에 맞게 사용할 수 있는 기능을 알아보자
먼저 공통으로 사용하는 부분과 파일마다 추가해야할 부분을 정의한 타임리프를 만든다.

다음으로 레이아웃을 호출하는 타임리프를 만든다.

호출방식은 템플릿 조각에서 이미 살펴봤다. 그런데 파라미터에 ~{::title} , ~{::link} 이 있다.
~{::} 는 특수태그로 동적으로 변수를 할당할때 사용한다. 위 코드에서는 title 태그와 link 태그들이 파라미터로 전달된다

실행결과 <title> 로 전달된 "메인타이틀" 이 레이아웃에 표시되었고,
<link> 태그들 역시 추가된 것을 확인 할 수 있다.
<레이아웃 확장>
레이아웃의 개념은 <html> 전체에 적용 할 수 도 있다.

html 태그에 th:fragment 태그를 사용하여 레이아웃을 생성했다.
<html> 에 th:fragment 속성이 정의되어 있다. 이 레이아웃 파일을 기본으로 하고
여기에 필요한 내용을 전달해서 부분부분 변경한다.

파라미터를 통해 title 태그와 section 태그를 파라미터로 전달하고 있다.
<html> 자체를 th:replace 를 사용해서 변경하는 것을 확인할 수 있다.
결국 레이아웃에 필요한 내용을 전달하면서 <html> 자체를 레이아웃 파일로 변경한다.
'프로그래밍 > 템플릿 엔진(thymeleaf, jsp)' 카테고리의 다른 글
| [Thymeleaf] 메시지, 국제화 기능 사용하기 (0) | 2024.02.07 |
|---|---|
| [Thymeleaf] 타임리프 기본기능 정리 (0) | 2024.02.05 |
| [JSP] 문자열 처리 함수 사용하기 (0) | 2023.07.17 |
| [JSP] 예외처리 (0) | 2023.07.11 |
| [JSP] Cookie (0) | 2023.06.20 |
