본문 바로가기

Spring/Thymeleaf7

Thymeleaf 페이지 레이아웃 보통 웹사이트를 만드려면 header , footer, menu 등 공통적인 페이지 구성 요소들이 있다. 이런 공통 요소들을 모든 html 에 넣는다면 수정 시 전부다 찾아서 바꿔줘야 한다. 이러한 문제점을 해결하기 위해 페이지 레이아웃을 이용하여 공통 요소 관리를 쉽게 할 수 있다. 의존성 추가하기 - gradle implementation 'org.springframework.boot:spring-boot-starter-thymeleaf' implementation 'org.thymeleaf.extras:thymeleaf-extras-springsecurity5' implementation 'nz.net.ultraq.thymeleaf:thymeleaf-layout-dialect' 예제를 위한 파일 생.. 2022. 9. 14.
th:href 예제 타임리프에서는 링크를 처리하는 문법으로 th:href를 사용한다. @GetMapping("/ex05") public String thymeleafExample05() { return "thymeleafEx/thymeleafEx05"; } 아래와 같이 상대경로와 절대경로로 표현할 수 있다. 태그를 사용하여 th:href="@{ }" 안에 경로를 넣어준다 예제 1페이지 이동 thymeleaf 공식 홈페이지 이동 Thymeleaf 링크처리 예제 페이지 예제 1페이지 이동 thymeleaf 공식 홈페이지 이동 결과 2022. 9. 13.
th:switch & th:case 예제 @GetMapping("/ex05") public String thymeleafExample05(Model model) { List itemDtoList = new ArrayList(); for (int i = 1; i 2022. 9. 13.
th:if & th:unless 예제 @GetMapping("/ex04") public String thymeleafExample04(Model model) { List itemDtoList = new ArrayList(); for (int i = 1; i 2022. 9. 13.
th:each 예제 반복문을 활용해서 List 에 값을 담아주었다. @GetMapping("/ex03") public String thymeleafExample03(Model model) { List itemDtoList = new ArrayList(); for (int i = 1; i 2022. 9. 13.
th:text 예제 데이터를 주고 받을 때는 Entity 클래스 자체를 반환하면 안되며, 데이터 전달용 객체(Data Tranfer Object)를 생성해서 사용해야 한다. ItemDto.class @Data public class ItemDto { private Long id; private String itemNm; private Integer price; private Integer stock; private String itemDetail; private String sellStatus; private LocalDateTime regTime; private LocalDateTime updateTime; } 컨트롤러 예제 @GetMapping("/ex02") public String thymeleafExample02(.. 2022. 9. 13.
thymeleaf 소개, 시작해보기 thymeleaf 는 SSR(서버 사이드 렌더링) 서버 사이드 템플릿 엔진이라고 불린다. 서버사이드 렌더링 종류로는 JSP, FreeMaker, Mustache 등이 있는데, 처음 시작하는 입장으로써, 스프링과 가장 연동이 잘 되어있는(기능이 많은 ) thymeleaf 로 시작하게 되었다. 타임리프의 가장 큰 장점은 natural templates 라는 것이다. JSP 는 확장자가 .JSP 로 되어있는데, 웹 브라우저에서 파일을 띄우면 JSP 문법이 화면에 나타난다. 이와 다르게 타임리프는 네츄럴템플릿으로, 확장자가 .html 이며 렌더링을 하지 않더라도 정상적인 화면을 볼 수 있다. 타임리프를 사용하려면 아래 코드를 꼭 추가해주어야 한다. xmlns:th="http://www.thymeleaf.org".. 2022. 9. 13.