Thymeleaf 시작하기 (2) - spring boot + thymeleaf 프로젝트 생성

Updated:

개발 환경

  • Language : Java 11
  • Framework : Spring Boot 2.5.5
  • Build Tool : Maven
  • Packaging : Jar
  • Dependencies : Spring Web, Thymeleaf

프로젝트 생성

Spring initializr 사이트 (https://start.spring.io/) 에서 아래와 같이 템플릿 프로젝트를 생성한다. 설정 값 입력 후에 하단의 ‘Generate’ 버튼을 선택하여 프로젝트를 다운로드 받으면 된다.

프로젝트 구조

다운로드 받은 프로젝트를 열어보면 다음의 구조와 같이 구성되어있다. 주요 패키지를 살펴보면 다음과 같다.

  • java : java 소스
  • resources/static : css, js 등의 자원
  • resources/templates : html 템플릿 자원

Thymeleaf Template

먼저 타임리프 템플릿 파일을 생성해보자. 아주 간단한다. 아래 샘플을 보면 알 수 있듯이 일반 html 파일과 다를 것이 없다. ‘th’ 태그 사용을 위해 thymeleaf 네임스페이스만 추가해주면 된다.

아래 소스는 th 태그를 사용하여 간단하게 텍스트 값을 출력하고 있다.

<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<p><span th:text="${say}">Hi</span> Thymeleaf</p>
</body>
</html>

위와 같이 템플릿 소스를 작성했다면 html 파일을 spring boot 서버를 기동하지 않고 그냥 브라우저에서 열어보자. (크롬이나 IE 나 상관없다.) 다음과 같이 ‘Hi Thymeleaf’ 라는 메세지가 보일것이다.

Controller

그럼 이번에는 서버를 통해 값을 전달받아 화면에 보이도록 Controller 파일을 생성해보자.

package com.example.demo;

import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.RequestMapping;

@Controller
@RequestMapping("/sample")
public class SampleController {
    @GetMapping("/say")
    public String sayHello(Model model) {
        model.addAttribute("say", "Hello");
        return "sample";
    }
}

say 라는 객체에 ‘Hello’ 를 담아 전달하는 서비스를 생성하였다. 해당 서비스를 호출하면 앞서 만든 sample 템플릿 화면에 렌더링되어 리턴되게 된다.

참고로 서비스에서는 리턴 값에 템플릿명만 적어도 resources/templates 내에서 sample.html 파일을 찾아 리턴하는 것이다. 이를 변경하고 싶으면 application.properties 나 application.yml 파일에서 다음과 같이 명시할 수 도 있다.

spring:
  thymeleaf:
    prefix: classpath:/templates/
    suffix: .html

자, 이번에는 spring boot 서버를 기동한 후 생성한 서비스를 호출해보자.

  • http://localhost:8080/sample/say

앞서 확인한 화면과 달리 이번에는 ‘Hello Thymeleaf’ 라고 나타날 것이다. 바로 서버를 통해 전달받은 ‘say’ 객체 값이 화면에 보여진 것이다.

정리

지금까지 간단한 예제를 통해 thymeleaf 템플릿을 구현해보았다. th 태그 사용을 위한 기본 표현식에는 다양한 것들이 있다. 다음에는 기본 표현식에 대해 알아가보자.

Thymeleaf 시작하기 (3) - spring boot + thymeleaf 기본 표현식