728x90
728x90
※ 본 포스팅은 김영한 강사님의 인프런 '실전! 스프링 부트와 JPA 활용1 - 웹 애플리케이션 개발' 강의를 들으며 작성한 수강일지 입니다.
| 프로젝트 환경설정
1. 프로젝트 생성
2. 라이브러리 살펴보기
3. View 환경설정
4. H2 데이터베이스 설치
5. JPA와 DB 설정, 동작 확인
3. View 환경 설정
1) 메뉴얼
thymeleaf 템플릿 엔진
- 공식 홈페이지 : https://www.thymeleaf.org/
- 장점 : 마크업을 깨지않고 그대로 쓸 수 있고, 웹 브라우저에서 열면 열림
- 단점 : (2 버전대) 무조건 닫는 태그를 정확히 매칭하지 않으면 에러가 났었음 -> 3.0에서는 가능하고 성능도 개선 되었다고 함
thymeleaf 스프링 공식 튜토리얼
- 스프링 공식 튜토리얼 : https://spring.io/guides > 검색 input에 serving 검색 > Serving Web Content with Spring MVC 보고 따라해보기
템플릿 엔진에 관한 스프링부트 메뉴얼
따로 세팅은 필요치 않으니 직접 해보기
2) 직접 해보기
- HelloController 만들기
// src/main/java/jpabook.jpashop/HelloController
package jpabook.jpashop;
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) {
// spring ui에 있는 model에 데이터를 실어서 controller -> view에 넘길 수 있음
model.addAttribute("data", "hello!!!");
// * 스프링 부트 thymeleaf viewName 매핑
// resources:templates/ +{ViewName}+ .html
return "hello"; // 화면 이름 -> .html이 자동으로 붙음
}
}
- view 만들기
<!-- src/main/resources/templates/hello.html -->
<!DOCTYPE html>
<!-- html의 name space를 thymeleaf로 줌 -->
<html xmlns:th="http://www.thymeleaf.org">
<head>
<title>Hello</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
</head>
<body>
<!-- 여기를 타면 data 부분에 값이 들어갈 것, 순수한 html로 했을 때는 '안녕하세요. 손님'이 출력-->
<p th:text="'안녕하세요. ' + ${data}">안녕하세요. 손님</p>
</body>
</html>
-> server side rendering 없이 실행시키면,
- 그냥 html만 실행시킨 것인데 '안녕하세요. 손님'만 찍힘 -> 이것이 thymeleaf의 장점
- 페이지 소스를 보면 위 처럼 되어있음
-> server side rendering
실행해보면, hello가 찍힌다
- 정적인 페이지 만들기(server side rendering 하지않고 순수한 html을 뿌리고싶을 때)
- 위처럼 templates 폴더가 아닌 static 폴더 내에 .html 파일 만들어 주기
- resources 폴더 내에서 수정할 때는 항상 서버를 다시 띄워야 함
<!-- src/main/resources/statc/index.html -->
<!DOCTYPE html>
<html>
<head>
<title>Hello</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
</head>
<body>
Hello
<a href="/hello">hello</a>
</body>
</html>
3) 서버 리스타트
- view를 수정할 일이 많은데, 이 때마다 서버를 restart 하지 않으면 변화가 없음
- Recompile을 해도 안됨
-> 라이브러리 를 추가해서 더 편하게
-> 이렇게 해도 변화는 없을 것 -> 해당 html 파일만 Recompile하면 서버를 재시작하지 않아도 html이 새로고침하면 바뀐다고 하는데 나는 안되어서 우측 Gradle > Reload All Gradle Projects 클릭
> 서버 재시작을 하니 강사님이 설명하신대로 'restartMain'이 뜨기 시작했고
> 그제서야 서버 재시작 없이도 html 파일만 recompile했을 때 F5 누르면 html 화면이 갱신되는 것을 확인할 수 있었다
728x90
728x90
'프로그래밍 > spring boot' 카테고리의 다른 글
[스프링부트] 실전! 스프링 부트와 JPA 활용1 #1-5 JPA와 DB 설정, 동작확인 (0) | 2023.10.25 |
---|---|
[스프링부트] 실전! 스프링 부트와 JPA 활용1 #1-4 H2 데이터베이스 설치 (0) | 2023.10.25 |
[스프링부트] 실전! 스프링 부트와 JPA 활용1 #1-2 라이브러리 살펴보기 (0) | 2023.10.24 |
[스프링부트] 실전! 스프링 부트와 JPA 활용1 #0 강좌 소개 (0) | 2023.10.23 |
[JPA] Hibernate (0) | 2021.06.03 |