타임리프(Thymeleaf)란?
- 타임리프는 자바 라이브러리이며, 텍스트, HTML, XML, Javascript, CSS 그리고 텍스트를 생성할 수 있는 템플릿 엔진이다.
- 스프링 MVC와의 통합 모듈을 제공하며, 애플리케이션에서 JSP로 만든 기능들을 완전히 대체할 수 있다.
- Spring Boot에서는 JSP가 아닌 Thymeleaf 사용을 권장하고 있다.
dependencies(
...생략
//타임리프
implementation 'org.springframework.boot:spring-boot-starter-thymeleaf'
)
Thymeleaf plug-in install
- Install New software에서 Work with에 http://www.thymeleaf.org/eclipse-plugin-update-site/ 를 입력한 뒤 플러그인 설치
![](https://velog.velcdn.com/images/yongseok0419/post/f2f6a78b-4cb1-49d7-9f0e-fefb19dd73d0/image.png)
![](https://velog.velcdn.com/images/yongseok0419/post/2e622656-9589-4354-bd86-3655a3e131f7/image.png)
- 위의 그림에서 주소를 적어주고 add 버튼을 누르면 아래와 같은 창이 뜨게되는데, Name에 thymeleaf라고 적어주고 add 버튼을 눌러준다.
![](https://velog.velcdn.com/images/yongseok0419/post/fc3c4f8d-0073-41cc-bad0-057dd2b519c2/image.png)
- Thymeleaf Eclipse Plugin을 체크한뒤 Next > 버튼을 클릭한다.
![](https://velog.velcdn.com/images/yongseok0419/post/3f630b7a-643f-4c0f-b226-9e1030e74a48/image.png)
- 설치를 진행하기위해 Next > 버튼을 클릭한다.
![](https://velog.velcdn.com/images/yongseok0419/post/c92e58c1-fa7a-44d8-be64-42141c6c56c8/image.png)
- 라이센스에 동의하고 Finish 버튼을 클릭한다.
![](https://velog.velcdn.com/images/yongseok0419/post/47693fd7-e4f1-4df3-90d0-f78d6752e4fa/image.png)
- 이제 Progress창에서 설치진행도를 알려주는데 중간에 Security Warning 창이 뜨는데 그냥 Install anyway 버튼을 클릭해서 설치를 계속 진행한다.
![](https://velog.velcdn.com/images/yongseok0419/post/22aa1439-5eec-4b48-b5ee-2d1e09479d22/image.png)
- 설치가 완료되면 Software Updates 창이 뜨는데 Restart Now 버튼을 클릭해서 STS4을 재실행한다.
![](https://velog.velcdn.com/images/yongseok0419/post/d2b04fe4-f2f5-4763-bd43-c5fc4ceef465/image.png)
- 마켓플레이스에서 groovy 플러그인을 설치한다.
![](https://velog.velcdn.com/images/yongseok0419/post/afbcd9ff-4b5b-4cea-a2fb-b43d5de4ff2c/image.png)
![](https://velog.velcdn.com/images/yongseok0419/post/3fc37291-9b73-476f-be94-ffea218c7b1c/image.png)
- default 그대로 두고 Confirm > 버튼을 클릭한다.
![](https://velog.velcdn.com/images/yongseok0419/post/a9c3b0e2-b675-4b85-a445-c6507552a5ad/image.png)
- 마찬가지로 라이센스에 동의하고 Finish 버튼을 클릭한다.
![](https://velog.velcdn.com/images/yongseok0419/post/e61efa6b-ab31-4a99-9233-bfd6e26108a5/image.png)
- 설치 도중 Security Warning 창이 뜨게되면 마찬가지로 Install anyway 버튼을 클릭해주고 Software Updates 창이 뜨면 Restart Now 버튼을 클릭해준다.
![](https://velog.velcdn.com/images/yongseok0419/post/9d4e3aba-e000-459f-a22c-bd1b35fc752c/image.png)
- 프로젝트 우클릭 config 탭에서 add thymeleaf nature 를 클릭한다.
![](https://velog.velcdn.com/images/yongseok0419/post/c06a648f-7125-479d-8244-9119b90d8dbf/image.png)
- 다시 프로젝트 우클릭을 하면 Thymeleaf 가 보이면 설치가 완료된것이다.
![](https://velog.velcdn.com/images/yongseok0419/post/ad6e56c5-c998-44ae-b9ec-8cc2175da38e/image.png)
Spring Boot의 화면출력방식
- view는 프로젝트명/src/main/resources 폴더 아래에 templates 패키지 아래에 있어야한다.
![](https://velog.velcdn.com/images/yongseok0419/post/55ddbdc2-3fbf-4e8c-8a8c-94820d93f68d/image.png)
- 연습용으로 html 파일 하나 만들어주자.
![](https://velog.velcdn.com/images/yongseok0419/post/321c606b-79ca-422b-a8c0-334ed53a864f/image.png)
- 스프링은 화면을 보기위한 Controller가 있어야하기때문에 ThymeleafController를 만들어준다.
- 화면 출력을 할 수 있도록 메서드를 만들어준다.
![](https://velog.velcdn.com/images/yongseok0419/post/5e874d9f-eac4-4141-a783-0f2a2b0fd989/image.png)
- thymeleaf 문법은 사용하지않고 먼저 화면 출력을 해보자.
![](https://velog.velcdn.com/images/yongseok0419/post/b78c5518-4c5b-4890-848c-1b0d939ddfb1/image.png)
- 클라이언트쪽의 브라우저창에서 들어오는 경로를 변경해보자.
![](https://velog.velcdn.com/images/yongseok0419/post/58647f61-e88b-4322-bae6-f1de5aa0b3dc/image.png)
- @GetMapping은 바로 사용하는 메서드 위에 적어주지만, 공통적으로 들어오는 경로를 잡아주려면 클래스 위에 @RequestMapping('/들어올경로') 어노테이션을 적어준다.
- 7번과 브라우저창에서 같은 경로로 들어오지만 코드가 다른것을 확인할 수 있다.
![](https://velog.velcdn.com/images/yongseok0419/post/8785eb54-166a-4d96-94e1-4f79e537d0fe/image.png)