728x90
thymeleaf 는 SSR(서버 사이드 렌더링) 서버 사이드 템플릿 엔진이라고 불린다.
서버사이드 렌더링 종류로는 JSP, FreeMaker, Mustache 등이 있는데, 처음 시작하는 입장으로써,
스프링과 가장 연동이 잘 되어있는(기능이 많은 ) thymeleaf 로 시작하게 되었다.
타임리프의 가장 큰 장점은 natural templates 라는 것이다.
JSP 는 확장자가 .JSP 로 되어있는데, 웹 브라우저에서 파일을 띄우면 JSP 문법이 화면에 나타난다.
이와 다르게 타임리프는 네츄럴템플릿으로, 확장자가 .html 이며 렌더링을 하지 않더라도 정상적인 화면을 볼 수 있다.
타임리프를 사용하려면 아래 코드를 꼭 추가해주어야 한다.
xmlns:th="http://www.thymeleaf.org"
타임리프 시작해보기.
<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<p th:text="${data}"> Hello Thymeleaf </p>
</body>
</html>
절대경로를 복사해서, 웹브라우저에 띄어보았다.
애플리케이션을 실행 후 , 서버 사이드 렌더링을 통해 해당 페이지에 접근해보는 방법은 아래와 같다.
컨트롤러를 생성해준다.
@Controller
@RequestMapping("/thymeleaf") // /thymeleaf 경로로 오는 요청을 처리
public class ThymeleafExController {
@GetMapping("/ex01") // localhost:8080/thymeleaf/ex01
public String thymeleafExample01(Model model) {
// model 객체를 이용해 뷰에 데이터들 전달
model.addAttribute("data" , "타임리프 예제 입니다.");
return "thymeleafEx/thymeleafEx01";
}
}return 의 값은 타임리프 html 파일의 경로이다.
model 에 들어가있는 data 라는 name 이 타임리프 파일에 들어가있는 ${data} 에 값이 들어가게 되고,
본문내용이 치환되게 된다.
따라서, 서버 사이드 렌더링을 해서 나온 결과 화면은 아래와 같다.
728x90
'Spring > Thymeleaf' 카테고리의 다른 글
| th:href 예제 (0) | 2022.09.13 |
|---|---|
| th:switch & th:case 예제 (0) | 2022.09.13 |
| th:if & th:unless 예제 (0) | 2022.09.13 |
| th:each 예제 (0) | 2022.09.13 |
| th:text 예제 (0) | 2022.09.13 |
댓글