2 분 소요

 인프런 스프링 MVC 2편 - 백엔드 웹 개발 활용 기술편을 학습하고 정리한 내용 입니다.

유틸리티 객체와 날짜

타임리프는 문자, 숫자, 날짜, URI등을 편리하게 다루는 다양한 유틸리티 제공.

타임리프 유틸리티 객체들

  • #message : 메시지, 국제화 처리
  • #uris : URI 이스케이프 지원
  • #dates : java.util.Date 서식 지원
  • #calendars : java.util.Calendar 서식 지원
  • #temporals : 자바8 날짜 서식 지원
  • #numbers : 숫자 서식 지원
  • #strings : 문자 관련 편의 기능
  • #objects : 객체 관련 기능 제공
  • #bools : boolean 관련 기능 제공
  • #arrays : 배열 관련 기능 제공
  • #lists , #sets , #maps : 컬렉션 관련 기능 제공
  • #ids : 아이디 처리 관련 기능 제공, 뒤에서 설명

타임리프 유틸리티 객체

유틸리티 객체 예시

자바 8 날짜

타임리프에서 자바 8 날짜인 LocalDate, LocalDateTime, Instant를 사용하려면 추가 라이브러리가 필요하다.

스프링 부트 타임리프를 사용하면 해당 라이브러리가 자동으로 추가되고 통합된다.

타임리프 자바8 날짜 지원 라이브러리 thymeleaf-extras-java8time

참고 : 스프링 부트 3.2이상을 사용한다면, 타임리프 자바8 날짜 지원 라이브러리가 이미 포함되어 있다.
따라서 별도로 포함하지 않아도 된다.

자바8 날짜용 유틸리티 객체 : #temporals

1
2
3
4
5

@GetMapping("/date")  
public String date(Model model) {  
    model.addAttribute("localDateTime", LocalDateTime.now());  
    return "basic/date";  
}

다음과 같이 날짜를 넘겼다.

resources/templates/basic/date.html

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32

<!DOCTYPE html>  
<html xmlns:th="http://www.thymeleaf.org">  
<head>  
    <meta charset="UTF-8">  
    <title>Title</title>  
</head>  
<body>  
  
<h1>LocalDateTime</h1>  
<ul>  
    <li>default = <span th:text="${localDateTime}"></span></li>  
    <li>yyyy-MM-dd HH:mm:ss = <span th:text="${#temporals.format(localDateTime, 'yyyy-MM-dd HH:mm:ss')}"></span></li>  
</ul>  
  
<h1>LocalDateTime - Utils</h1>  
<ul>  
    <li>${#temporals.day(localDateTime)} = <span th:text="${#temporals.day(localDateTime)}"></span></li>  
    <li>${#temporals.month(localDateTime)} = <span th:text="${#temporals.month(localDateTime)}"></span></li>  
    <li>${#temporals.monthName(localDateTime)} = <span th:text="${#temporals.monthName(localDateTime)}"></span></li>  
    <li>${#temporals.monthNameShort(localDateTime)} = <span th:text="${#temporals.monthNameShort(localDateTime)}"></span></li>  
    <li>${#temporals.year(localDateTime)} = <span th:text="${#temporals.year(localDateTime)}"></span></li>  
    <li>${#temporals.dayOfWeek(localDateTime)} = <span th:text="${#temporals.dayOfWeek(localDateTime)}"></span></li>  
    <li>${#temporals.dayOfWeekName(localDateTime)} = <span th:text="${#temporals.dayOfWeekName(localDateTime)}"></span></li>  
    <li>${#temporals.dayOfWeekNameShort(localDateTime)} = <span th:text="${#temporals.dayOfWeekNameShort(localDateTime)}"></span></li>  
    <li>${#temporals.hour(localDateTime)} = <span th:text="${#temporals.hour(localDateTime)}"></span></li>  
    <li>${#temporals.minute(localDateTime)} = <span th:text="${#temporals.minute(localDateTime)}"></span></li>  
    <li>${#temporals.second(localDateTime)} = <span th:text="${#temporals.second(localDateTime)}"></span></li>  
    <li>${#temporals.nanosecond(localDateTime)} = <span th:text="${#temporals.nanosecond(localDateTime)}"></span></li>  
</ul>  
  
</body>  
</html>

이렇게 날짜 형식을 변환할 수 있다.

1

<span th:text="${#temporals.format(localDateTime, 'yyyy-MM-dd HH:mm:ss')}"></span>

이거 자주 쓸 것 같다.

이런 식으로 변환이 잘 된다.

URL 링크

타임리프에서 URL을 생성할 때는 @{...}를 사용한다.

1
2
3
4
5
6

@GetMapping("/link")  
public String link(Model model) {  
    model.addAttribute("param1", "date1");  
    model.addAttribute("param2", "date2");  
    return "basic/link";  
}

이렇게 파람 2개를 넣어서 넘겨버렸다.

resources/templates/basic/link.html

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16

<!DOCTYPE html>  
<html xmlns:th="http://www.thymeleaf.org">  
<head>  
    <meta charset="UTF-8">  
    <title>Title</title>  
</head>  
<body>  
<h1>URL 링크</h1>  
<ul>  
    <li><a th:href="@{/hello}">basic url</a></li>  
    <li><a th:href="@{/hello(param1=${param1}, param2=${param2})}">hello query param</a></li>  
    <li><a th:href="@{/hello/{param1}/{param2}(param1=${param1}, param2=${param2})}">path variable</a></li>  
    <li><a th:href="@{/hello/{param1}(param1=${param1}, param2=${param2})}">path variable + query parameter</a></li>  
</ul>  
</body>  
</html>

다음과 같이 작성했다. <li>에 여러 방식이 있는데, 하나씩 살펴보자.

단순한 URL

<li><a th:href="@{/hello}">basic url</a></li>

  • ${/hello} → /hello

쿼리 파라미터

<li><a th:href="@{/hello(param1=${param1}, param2=${param2})}">hello query param</a></li>

  • @{/hello(param1=${param1}, param2=${param2})}
    • → /hello?param1=data1&param2=data2
    • ()에 있는 부분은 쿼리 파라미터로 처리된다.

경로 변수

<li><a th:href="@{/hello/{param1}/{param2}(param1=${param1}, param2=${param2})}">path variable</a></li>

  • @{/hello/{param1}/{param2}(param1=${param1}, param2=${param2})}
    • → /hello/data1/data2
    • URL 경로상에 변수가 있으면 () 부분은 경로 변수로 처리된다.

경로 변수 + 쿼리 파라미터

<li><a th:href="@{/hello/{param1}(param1=${param1}, param2=${param2})}">path variable + query parameter</a></li>

  • @{/hello/{param1}(param1=${param1}, param2=${param2})}
    • → /hello/data1?param2=data2
    • 경로 변수와 쿼리 파라미터를 함께 사용할 수 있다.


상대 경로, 절대 경로, 프로토콜 기준을 표현할 수도 있다.

  • /hello : 절대 경로
  • hello : 상대 경로

댓글남기기

참고