01. Thymeleaf와 jsp의 차이점
Thymeleaf는 HTML, XML, JavaScript, CSS 및 일반 텍스트를 처리 할 수 있는 웹 및 독립형 환경에서 사용할 수 있는 Java 템플릿 엔진입니다. Thymeleaf는 html파일을 가져와서 파싱해서 분석후 정해진 위치에 데이터를 치환해서 웹 페이지를 생성합니다.
JSP는 서블릿으로 변환되어 실행이 되어집니다.
JSP 내에서 자바 코드를 사용할 수도 있습니다(사용하지 못하도록 설정할 수 있습니다).
Thymeleaf는 자바코드를 사용할 수 없고, jsp에서 처럼 커스텀 태그와 같은 기능도 없습니다.
Thymeleaf
Integrations galore Eclipse, IntelliJ IDEA, Spring, Play, even the up-and-coming Model-View-Controller API for Java EE 8. Write Thymeleaf in your favourite tools, using your favourite web-development framework. Check out our Ecosystem to see more integrati
www.thymeleaf.org
스프링 공식 튜토리얼 Spring | Guides
Spring | Guides
Whatever you're building, these guides are designed to get you productive as quickly as possible – using the latest Spring project releases and techniques as recommended by the Spring team.
spring.io
검색창에 serving web이라고 입력하고 초록색 네모박스를 클릭하면 가이드가 나옵니다.
코드를 입력하면서 따라해보는것도 좋습니다.
HelloController.java
package com.codezero.study;
import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.GetMapping;
@Controller
public class HelloController {
@GetMapping("hello")
public String hello(Model model) throws Exception{
model.addAttribute("data","hello");
return "hello";
}
}
hello.html
파일은 templates 아래에 생성합니다.
<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org" >
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<p th:text="'안녕하세요 '+${data}">안녕하십니까? 손님</p>
</body>
</html>
alt +F2를 눌러서 chrome으로 실행합니다.
랜더링이 되기전의 화면이 나옵니다.
랜더링이란?
스프링 부트에서 랜더링은 웹 애플리케이션에서 사용자에게 보여지는 화면을 생성하는 과정을 말합니다. 사용자가 요청한 페이지나 데이터를 기반으로 동적으로 HTML, XML, JSON 등의 문서를 생성하고 이를 클라이언트(웹 브라우저)에게 전달합니다. 이렇게 생성된 화면은 사용자에게 시각적으로 나타나며, 웹 애플리케이션의 사용자 경험과 인터페이스를 결정하는 중요한 부분입니다.
스프링 부트에서는 템플릿 엔진을 사용하여 랜더링 작업을 수행합니다. 템플릿 엔진은 미리 정의된 템플릿과 동적으로 변경될 데이터를 결합하여 최종적인 문서를 생성하는 역할을 합니다. 스프링 부트에서는 주로 Thymeleaf, Freemarker, Mustache 등의 템플릿 엔진을 많이 사용합니다.
출력)
이제 localhost:8080/hello를 입력해보겠습니다.
출력)
랜더링을 하지 않는 정적페이지는 static 폴더아래에 만듭니다.
index.html을 만들어보겠습니다.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<a href="/hello">hello</a>
</body>
</html>출력)
