728x90
반응형
타임리프 Thymeleaf
- 서버 사이드 HTML 렌더링 (SSR)
- 타임리프는 백엔드 서버에서 HTML을 동적으로 렌더링 하는 용도로 사용
- 내추럴 템플릿
- 순수 HTML을 유지하는 특성으로 HTML 파일로 열람이 가능
- 파일을 직접 열 경우 동적으로 결과가 렌더링 되지는 않지만 마크업 결과가 어떻게 되는지는 확인 가능
- 순수 HTML을 그대로 유지하면서 뷰 템플릿도 사용가능한 특징
- 스프링 통합 지원
- 스프링과 통합되고 스프링의 다양한 기능을 편리하게 사용할 수 있게 지원
기본 기능
사용 선언
<html xmlns:th="http://www.thymeleaf.org">
기본 표현식
Tutorial: Using Thymeleaf
1 Introducing Thymeleaf 1.1 What is Thymeleaf? Thymeleaf is a modern server-side Java template engine for both web and standalone environments, capable of processing HTML, XML, JavaScript, CSS and even plain text. The main goal of Thymeleaf is to provide a
www.thymeleaf.org
텍스트 - text, utext
- HTML의 콘텐츠에 데이터를 출력할 때 사용
- 타임리프 태그와 함께 사용
- ex) th:text="${data}" 또는 [[${data}]]
차이점
- text
- <와 같은 특수 문자가 포함될 경우 HTML 코드에 렌더링 되지 않게 HTML 엔티티로 변경하는 이스케이프 제공
- 텍스트를 알아서 안전하게 이스케이프 하여 HTML로 잘못 렌더링 되지 않게 함
- utext
- 특수문자가 HTML 엔티티로 변경되지 않음
- HTML 콘텐츠를 직접 삽입하여 태그와 HTML 코드가 실제로 렌더링 됨
- HTML이 정상 렌더링 되지 않는 수 많은 문제가 발생할 수 있음
표현식 - SpEL (Spring Expression Language)
- 변수 표현식 : ${...}
- 다양한 자료구조 사용 가능(Object, List, Map등)
- th:with를 통해 지역 변수 선언 가능
- URL 표현식 : @{...}
- 쿼리 파라미터 : @{/hello(param1=${param1}, param2=${param2})} () 부분은 쿼리 파라미터로 대체
- 경로 변수 : @{/hello/{param1}/{param2}(param1=${param1}, param2=${param2})} URL 경로상 변수 처리
- 경로 + 파라미터 : @{/hello/{param1}(param1=${param1}, param2=${param2})} 함께 사용 가능
- 리터럴
- 문자 리터럴은 ' (작은 따옴표)로 감싸야함
- 공백이 없다면 작은따옴표 생략 가능
- 중간에 공백이 있을 경우 하나의 의미 있는 토큰으로 인식되지 않음
- |...| 리터럴 대체 문법을 사용하여 작은따옴표를 대체 가능함
- 연산
- 비교연산 : > (gt), < (lt), >= (ge), <= (le), ! (not), == (eq), != (neq, ne)
- 조건식 : 자바의 3항 연산자와 유사 ex) th:text="${condition} ? '참' : '거짓'"
- Elvis 연산자 : 자바의 널 병합 3항 연산자와 유사 ex) th:text="${data}?: '데이터 없음'"
- No-Operation : _인 경우 타임리프가 실행되지 않는 것처럼 동작 ex) th:text="${data}?: _"
- 속성 값 설정
- th:*로 속성 지정 시 기존 속성 대체 또는 새로 생성
- <input type="text" name="mock" th:name="user" />의 경우 타임리프로 렌더링 시 name의 속성 값이 user로 대체
- th:attrappend : 속성 값의 뒤에 값을 추가
- th:attrprepend : 속성 값 앞에 값을 추가
- th:classappend : class 속성에 자연스럽게 추가
- 반복
- th:each를 사용하여 반복 처리
- <tr th:each="user : ${users}"> 반복 시 오른쪽 컬렉션 ${users}의 값을 하나씩 꺼내 user 변수에 담아 태그를 반복 실행
- 반복의 두 번째 파라미터를 설정해 반복 상태를 확인 가능
- index : 0부터 시작하는 값
- count : 1부터 시작하는 값
- size : 전체 사이즈
- even, odd : 홀수, 짝수 여부(boolean)
- first, last : 처음, 마지막 여부(boolean)
- current : 현재 객체
- 조건부 평가
- if, unless(if의 반대)를 사용하여 조건 평가
- 해당 조건이 맞지 않으면 태그 자체를 렌더링 하지 않음
- 조건이 false인 경우 해당 부분 자체가 렌더링 되지 않고 삭제됨
- switch문 사용 가능
- 주석
- 표준 HTML 주석 : 표준 HTML 주석은 그대로 남겨둠, 렌더링 된 페이지에 주석이 보임
- 타임리프 파서 주석 : 렌더링에서 주석 부분을 제거, 렌더링 된 페이지에서 주석내 내용이 보이지 않음
- 타임리프 프로토타입 주석 : HTML 파일을 그대로 열어 볼 경우 주석처리 되지만 타임리프를 렌더링 한 경우 데이터가 보임
- 블록
- 타임리프의 유일한 자체 태그
- 블록 자체를 지정해 재사용하거나 조건부 렌더링에 사용
- 자바스크립트 인라인
- 타임리프가 자바스크립트 코드 내에서 타임리프 표현식을 처리하고, 서버 측 데이터를 적절하게 클라이언트 측 자바스크립트로 변환
- 자동 이스케이프 처리
- 데이터 타입을 자바스크립트에서 사용할 수 있는 문자열로 변환함
스프링 MVC 1편 - 백엔드 웹 개발 핵심 기술 강의 | 김영한 - 인프런(inflearn.com) 강의 내용 참고
728x90
'백엔드 > Spring' 카테고리의 다른 글
| [Spring] 검증 Validation (0) | 2024.08.19 |
|---|---|
| [Spring] 메시지 국제화 (0) | 2024.08.03 |
| [Spring] Spring MVC (0) | 2024.07.27 |
| [Spring] 서블릿 & JSP MVC (0) | 2024.07.22 |
| [Spring] 자바 Servlet & JSP (3) | 2024.07.22 |