웹 프로젝트를 하다보면 html파일이던 jsp파일이던 구현해준 view파일들이 수도 없이 많아지는 게 일반적이다. 이때 여러개의 페이지에 공통으로 주는 스타일 부분 (ex - css, bootstrap 등) 들이 있기 마련인데, 이들의 파일 경로를 하나의 요소로 묶어 다른 파일들에서 간결하게 쓸 수 있는 방법을 보자. 다음은 간단한 회원관리 페이지에서 정적 파일을 쉽게 사용하도록 한 타임 리프 코드이다.
<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<!--config는 공통된 css나 javascript를 넣어서 페이지들에 넣어줄 수 있다. -->
<!--<th:block th:fragment="config">: 이 부분은 Thymeleaf에서
사용되는 블록(구성 요소)을 정의.
th:fragment 속성은 이 블록의 이름을 "config"로 설정.-->
<th:block th:fragment="config">
<meta charset="UTF-8">
<title>Member Project</title>
<link rel="stylesheet" th:href="@{/css/main.css}">
<link rel="stylesheet" th:href="@{/css/bootstrap.min.css}">
<script th:src="@{/js/axios/min.js}"></script>
</th:block>
<body>
</body>
</html>다음은 회원 관리 미니 프로젝트의 소스 코드이다.
