MapleStory Finger Point Cute Line Smiley Blinking Hello Kitty Angel MapleStory Finger Point

๐Ÿ’Ž Spring Boot

[SpringBoot] thymeleaf ํƒ€์ž„๋ฆฌํ”„ ๊ฐœ๋…

HYEJU01 2024. 8. 26. 22:00

โ—ˆ  thymeleaf ํƒ€์ž„๋ฆฌํ”„

Thymeleaf๋Š” ์„œ๋ฒ„ ์‚ฌ์ด๋“œ Java ํ…œํ”Œ๋ฆฟ ์—”์ง„์œผ๋กœ

Spring Boot์—์„œ ์ž์ฃผ ์‚ฌ์šฉ๋˜๋Š” ๋ทฐ ํ…œํ”Œ๋ฆฟ ๊ธฐ์ˆ ์ด๋‹ค.

 

jstl ๊ณผ ๋น„์Šทํ•˜๋‹ค.

 

๋ถ€ํŠธ๋Š” ๊ฐ€๋Šฅํ•˜๋ฉด jsp ๋ฅผ ํ”ผํ•˜๊ณ 

thymel๊ฐ™์€ view ํ…œํ”Œ๋ฆฟ ์—”์ง„์„ ์‚ฌ์šฉํ•˜๋ผ๊ณ  ๊ถŒ์žฅํ•œ๋‹ค. !!

 

ํ”„๋กœ์ ํŠธ๋ฅผ ์‹œ์ž‘ํ•  ๋•Œ, ๊ธฐ๋ณธ์ ์œผ๋กœ ํ™”๋ฉด ํ…œํ”Œ๋ฆฟ ์—”์ง„์ด ์„ค์ •๋˜์–ด ์žˆ์ง€ ์•Š๊ธฐ ๋•Œ๋ฌธ์—,

์›น ์• ํ”Œ๋ฆฌ์ผ€์ด์…˜์˜ ๋ทฐ(View) ์ฒ˜๋ฆฌ๋ฅผ ์œ„ํ•ด Thymeleaf์™€ ๊ฐ™์€ ํ…œํ”Œ๋ฆฟ ์—”์ง„์„ ์ถ”๊ฐ€

 

 

 

 

โ—ˆ ํƒ€์ž„๋ฆฌํ”„ ์‹œ์ž‘ํ•˜๊ธฐ

1. ํƒ€์ž„๋ฆฌํ”„ ์˜์กด์„ฑ ์ถ”๊ฐ€ํ•˜๊ธฐ

implementation 'org.springframework.boot:spring-boot-starter-thymeleaf'

2. html ํŒŒ์ผ๋กœ ์ž‘์„ฑํ•œ๋‹ค.

3. ์ตœ์ƒ๋‹จ์—  xmlns:th ๋ช…์‹œํ•ด์ค€๋‹ค. (๋ช…์‹œํ•ด์ฃผ๋Š” ํŽธ์ด ์ข‹๋‹ค.)

<html xmlns:th="http://www.thymeleaf.org">

 

 

 

โ—ˆ ํƒ€์ž„๋ฆฌํ”„ ๊ณต์‹ ํ™ˆํŽ˜์ด์ง€

http://www.thymeleaf.org/doc/tutorials/3.0/usingthymeleaf.html

 

Tutorial: Using Thymeleaf

1 Introducing Thymeleaf 1.1 What is Thymeleaf? Thymeleaf is a modern server-side Java template engine for both web and standalone environments, capable of processing HTML, XML, JavaScript, CSS and even plain text. The main goal of Thymeleaf is to provide a

www.thymeleaf.org

 

 

 

โ—ˆ ํƒ€์ž„๋ฆฌํ”„ ํƒ€์ž…

 

 

โ—ˆ ํƒ€์ž„๋ฆฌํ”„ ์ œ์–ด๋ฌธ

 

 

โ—ˆ ํƒ€์ž„๋ฆฌํ”„ util ๋ฌธ๋ฒ•

  • ํƒ€์ž„๋ฆฌํ”„๋Š” Utility Objectํ•จ์ˆ˜๋“ค์„ ๋‚ด์žฅ์œผ๋กœ ๊ฐ€์ง€๊ณ  ์žˆ์Šต๋‹ˆ๋‹ค.
  • ์ž๋ฐ”์˜ String ๋‚ด๋ถ€์— ๊ธฐ๋ณธ์ ์œผ๋กœ ๋‚ด์žฅ๋˜์–ด ์žˆ๋Š” ์—ฌ๋Ÿฌ ํ•จ์ˆ˜๋ผ๊ณ  ์ƒ๊ฐํ•˜๋ฉด ๋ฉ๋‹ˆ๋‹ค.
  • ๋‚ด์šฉ์ด ๋งŽ์•„์„œ ์ž˜ ์ •๋ฆฌ๋œ ๋ธ”๋กœ๊ทธ๋ฅผ ์ฒจ๋ถ€ํ•ฉ๋‹ˆ๋‹ค (ํ•„์š”ํ•˜๋‹ค๋ฉด ์ฐพ์•„์„œ ์‚ฌ์šฉ)
${#๋‚ด์žฅํ•จ์ˆ˜}

 

https://abbo.tistory.com/56

 


โ—ˆ ํƒ€์ž„๋ฆฌํ”„ include ๋ฌธ๋ฒ•

<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>

    <div th:fragment="part1">
        ํŒŒํŠธ1 ๋ถ€๋ถ„
    </div>

    <div th:fragment="part2">
        ํŒŒํŠธ2 ๋ถ€๋ถ„
    </div>



</body>
</html>