웹 화면에서 데이터를 표현할 때 문자열이나 숫자 같은 고정된 값(리터럴, Literal) 을 다루는 일은 기본이다.
하지만 Thymeleaf를 처음 접하면 작은따옴표(') 규칙 때문에 자주 실수하기 쉽다.
이번 글에서는 리터럴의 기본 개념부터, 문자열과 변수를 더 편리하게 합칠 수 있는 리터럴 대체 문법까지 차근차근 살펴보자.
1. 리터럴(Literal) 이란?
리터럴은 소스 코드 안에 고정된 값을 말한다. 예를 들어 자바 코드에서는:
String a = "Hello"; // 문자 리터럴
int b = 10 * 20; // 숫자 리터럴 (10, 20)
여기서 "Hello" 는 문자 리터럴, 10과 20은 숫자 리터럴이다.
Thymeleaf도 마찬가지로 리터럴을 그대로 표현식 안에서 사용할 수 있다.
2. Thymeleaf에서 지원하는 리터럴 종류
- 문자(String) : 'hello'
- 숫자(Number) : 10
- 불린(Boolean) : true, false
- null : null
중요한 규칙
문자 리터럴은 항상 '작은따옴표로 감싸야 한다.
<span th:text="'hello'"></span>
3. 작은따옴표 생략 규칙과 오류 예시
항상 따옴표를 붙이는 건 귀찮으니, Thymeleaf는 공백 없는 단어라면 작은따옴표 없이도 인식한다.
<span th:text="hello"></span> <!-- 가능 -->
하지만 문자열에 공백이 들어가면 반드시 '로 감싸야 한다.
오류 예시:
<span th:text="hello world!"></span>
수정된 예시:
<span th:text="'hello world!'"></span>
4. 컨트롤러 코드 준비
컨트롤러에서 테스트용 데이터를 전달해 보자.
@GetMapping("/literal")
public String literal(Model model) {
model.addAttribute("data", "Spring!");
return "basic/literal";
}
여기서 data = "Spring!" 값을 뷰에 넘긴다.
5. 뷰 템플릿 예제
<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="UTF-8">
<title>리터럴</title>
</head>
<body>
<h1>리터럴</h1>
<ul>
<!-- 주의! 이 코드는 오류 발생 -->
<!-- <li>"hello world!" = <span th:text="hello world!"></span></li> -->
<li>'hello' + ' world!' = <span th:text="'hello' + ' world!'"></span></li>
<li>'hello world!' = <span th:text="'hello world!'"></span></li>
<li>'hello ' + ${data} = <span th:text="'hello ' + ${data}"></span></li>
<li>리터럴 대체 |hello ${data}| = <span th:text="|hello ${data}|"></span></li>
</ul>
</body>
</html>
6. 실행 결과
브라우저로 /basic/literal에 접속하면 다음과 같이 출력된다:
'hello' + ' world!' = hello world!
'hello world!' = hello world!
'hello ' + Spring! = hello Spring!
리터럴 대체 |hello ${data}| = hello Spring!
결과 해석
- 'hello' + ' world!' → 문자열끼리 붙여서 hello world!
- 'hello world!' → 공백 포함 문자열, 작은따옴표로 감싸 정상 출력
- 'hello ' + ${data} → hello Spring! (data 값이 치환됨)
- |hello ${data}| → hello Spring! (리터럴 대체 문법으로 더 깔끔)
7. 리터럴 대체(Literal Substitution)
Thymeleaf는 문자열 조합을 더 쉽게 하기 위해 |...| 문법을 제공한다.
이 문법을 쓰면 변수를 문자열 안에 직접 넣을 수 있다.
<span th:text="|hello ${data}|"></span>
실행 결과: hello Spring!
마치 문자열 템플릿처럼 동작해서, + 연산자 없이도 문자열과 변수를 섞을 수 있다.
마무리하며
Thymeleaf는 단순 출력뿐만 아니라, 문자열 처리까지 고려한 리터럴 문법을 제공한다.
- 문자열 리터럴은 반드시 '로 감싸야 하며, 공백이 있으면 꼭 따옴표 필요
- 여러 문자열이나 변수를 합칠 때는 + 연산자로도 가능하지만, 리터럴 대체 문법(|...|) 을 쓰면 더 간단하고 가독성이 좋아진다.
즉, Thymeleaf는 안전하고 편리한 문자열 처리 방법을 지원한다는 점을 기억하자.
특히 따옴표(') 규칙은 실수하기 쉬운 부분이니 꼭 주의해야 한다.
감사합니다.
'타임리프' 카테고리의 다른 글
| [Thymeleaf] 속성 값 설정 (0) | 2025.09.15 |
|---|---|
| [Thymeleaf] 연산 (0) | 2025.09.15 |
| [Thymeleaf] URL링크 (0) | 2025.09.15 |
| [Thymeleaf] 유틸리티 객체와 날짜 (0) | 2025.09.15 |
| [Thymeleaf] 변수 -SpringEL (0) | 2025.09.11 |
