스프링부트는 웹 개발에 필요한 다양한 기능을 제공하는 프레임워크입니다. 이 중에서도 thymeleaf는 템플릿 엔진으로 자주 사용됩니다. thymeleaf를 사용하면 HTML, XML, JavaScript, CSS 등 다양한 형태의 문서를 생성할 수 있습니다.
의존성 추가
스프링부트에서 thymeleaf를 사용하기 위해서는 먼저 의존성을 추가해야 합니다. build.gradle
파일의 dependencies
블록에 다음과 같이 추가해주세요.
implementation 'org.springframework.boot:spring-boot-starter-thymeleaf'
템플릿 생성
thymeleaf를 사용하기 위해서는 HTML 파일에 thymeleaf 문법을 추가해야 합니다. thymeleaf 문법은 HTML 태그에 th
접두사를 붙여서 사용합니다. 예를 들어, 다음과 같은 코드는 th:text
속성을 사용하여 message
변수의 값을 출력합니다.
<!DOCTYPE html>
<html xmlns:th="<http://www.thymeleaf.org>">
<head>
<meta charset="UTF-8">
<title>Thymeleaf Example</title>
</head>
<body>
<h1 th:text="${message}"></h1>
</body>
</html>
컨트롤러 작성
템플릿에서 사용할 데이터를 제공하는 컨트롤러를 작성해야 합니다. 다음은 HelloController
클래스의 예시입니다. @Controller
애노테이션을 사용하여 컨트롤러임을 명시하고, @GetMapping
애노테이션을 사용하여 /hello
경로로 요청이 들어왔을 때 hello
메소드가 실행되도록 합니다.
@Controller
public class HelloController {
@GetMapping("/hello")
public String hello(Model model) {
model.addAttribute("message", "Hello, Thymeleaf!");
return "hello";
}
}
hello
메소드에서는 Model
객체를 사용하여 message
변수의 값을 설정합니다. 이 변수는 thymeleaf 템플릿에서 사용됩니다.
실행
이제 애플리케이션을 실행하여 /hello
경로로 요청을 보내면 Hello, Thymeleaf!
라는 메시지가 출력됩니다.
공식문서
thymeleaf의 if-else
thymeleaf에서는 th:if
와 th:unless
속성을 사용하여 조건부 렌더링을 할 수 있습니다. th:if
속성은 조건이 참일 때 요소를 렌더링하고, th:unless
속성은 조건이 거짓일 때 요소를 렌더링합니다.
예를 들어, 다음과 같은 코드는 message
변수의 값에 따라 출력되는 요소가 달라집니다.
<!DOCTYPE html>
<html xmlns:th="<http://www.thymeleaf.org>">
<head>
<meta charset="UTF-8">
<title>Thymeleaf Example</title>
</head>
<body>
<h1 th:if="${message == 'Hello'}">Hello, Thymeleaf!</h1>
<h1 th:unless="${message == 'Hello'}">Goodbye, Thymeleaf!</h1>
</body>
</html>
이 코드에서는 th:if
속성과 th:unless
속성을 사용하여 message
변수의 값에 따라 다른 문구를 출력합니다. 만약 message
변수의 값이 "Hello"라면 Hello, Thymeleaf!
를 출력하고, 그렇지 않으면 Goodbye, Thymeleaf!
를 출력합니다.
<div th:if="${session.principal == null}">
<ul class="nav navbar-nav navbar-right">
<li><a href="/joinForm"><span class="glyphicon glyphicon-user"></span> 회원가입</a></li>
<li><a href="/loginForm"><span class="glyphicon glyphicon-log-in"></span> 로그인</a></li>
</ul>
</div>
<div th:unless="${session.principal == null}">
<ul class="nav navbar-nav navbar-right">
<li><a href="/board/form"><span class="glyphicon glyphicon-edit"></span> 글쓰기</a></li>
<li><a href="/user/form"><span class="glyphicon glyphicon-user"></span> 회원정보</a></li>
<li><a href="/logout"><span class="glyphicon glyphicon-log-out"></span> 로그아웃</a></li>
</ul>
</div>
이 코드에서는 session
의 값을 확인하여 경우에 따라 nav-bar의 아이템을 변경시킵니다.
'Spring' 카테고리의 다른 글
[Spring Security] 스프링 시큐리티 시작하기 (0) | 2023.03.02 |
---|---|
[Spring Security] authorize가 인식 안되는 상황 (0) | 2023.03.02 |
[Srping Security] BCriptPasswordEncoder 해시 암호화 방법 (0) | 2023.03.02 |
[Spring Boot] REST (0) | 2023.02.19 |
[Spring boot] 스프링부트 동작원리 - 2 (DispatcherServlet = FrontController + RequestDispatcher) (0) | 2023.02.16 |