반응형
view를 위해서 build.gradle의 디펜던시에 thymeleaf, thymeleaf-layout 추가
dependencies {
...
implementation 'org.springframework.boot:spring-boot-starter-thymeleaf'
implementation 'nz.net.ultraq.thymeleaf:thymeleaf-layout-dialect'
}
gradle은 디펜던시가 수정되면 refresh gradle project 필요
WebController.java 추가, WebRestController에 있는 건 지워주었다
package com.cos.web01.controller;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.GetMapping;
@Controller
public class WebController {
@GetMapping({ "", "/" })
public String index() {
return "index";
}
}
templates 폴더 안에 index.html 추가
<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Document</title>
</head>
<body>
<h1>테스트</h1>
</body>
</html>
static 폴더에 bootstrap 4.0과 jquery 파일을 추가하였다
html 분할
layout.html
<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org"
xmlns:sec="http://www.thymeleaf.org/thymeleaf-extras-springsecurity5"
xmlns:layout="http://www.ultraq.net.nz/thymeleaf/layout">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>web01</title>
<!-- 부트스트랩 -->
<link rel="stylesheet" href="../static/css/lib/bootstrap.min.css" />
</head>
<body>
<header>
<h2>테스트 레이아웃</h2>
</header>
<nav>
<a href="/">main</a> <a href="/hello">hello</a>
</nav>
<section layout:fragment="contents"></section>
<footer>
<p>footer</p>
</footer>
<script src="../static/js/lib/jquery.min.js"></script>
<script src="../static/js/lib/bootstrap.min.js"></script>
</body>
</html>
index.html
<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org"
xmlns:sec="http://www.thymeleaf.org/thymeleaf-extras-springsecurity5"
xmlns:layout="http://www.ultraq.net.nz/thymeleaf/layout" layout:decorate="~{common/layout}">
<section layout:fragment="contents">
<h1>테스트</h1>
</section>
</html>
hello.html
<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org"
xmlns:sec="http://www.thymeleaf.org/thymeleaf-extras-springsecurity5"
xmlns:layout="http://www.ultraq.net.nz/thymeleaf/layout" layout:decorate="~{common/layout}">
<section layout:fragment="contents">
<h1>hello</h1>
</section>
</html>
WebController.java 수정
package com.cos.web01.controller;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.GetMapping;
@Controller
public class WebController {
@GetMapping({ "", "/" })
public String index() {
return "contents/index";
}
@GetMapping("/hello")
public String hello() {
return "contents/hello";
}
}
잘되는지 확인
반응형
'스프링 부트 > 웹MVC' 카테고리의 다른 글
| 글 등록, 글 목록 불러오기, 해당 글의 상세 페이지로 이동하기 (0) | 2021.12.09 |
|---|---|
| 업데이트, 더티 체킹 (0) | 2021.12.03 |
| 스프링 시큐리티 적용 (0) | 2021.12.03 |
| User 생성 작업 (0) | 2021.12.01 |
| 셋업 (0) | 2021.12.01 |
