2. 스프링 프로젝트 화면구성 (타임리프)

타임리프(Thymeleaf)란?

스프링에서 공식 지원하는 템플릿 엔진으로, HTML의 동적 렌더링을 위한 라이브러리입니다.

쉽게 말해, 서버에서 데이터를 넘겨보내면 타임리프는 해당 데이터를 가지고 HTML 화면을 제작합니다. 요청받은 데이터를 화면 구석구석에 배치한 뒤 사용자가 직접적으로 보게되는 완성된 템플릿(HTML파일)을 만드는 것이죠. 이를 SSR, Server Side Rendering이라고 합니다.

 

 

 

타임리프 설정

1. 의존성

 

 

 

Gradle

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

 

타임리프 라이브러리를 추가해주겠습니다. build.gradle 파일에 위와 같이 코드를 추가해줍니다. 이후 Reload Projects (Shift + Alt + U) 해주어 프로젝트에 의존성을 반영해줍니다.

 

 

Maven

<dependency> 
	<groupId>org.springframework.boot</groupId> 
    <artifactId>spring-boot-starter-thymeleaf</artifactId>
</dependency>

 

메이븐의 경우에는 위와 같습니다.

 

 

2. 경로 설정

 

yml 파일이 관리하기 편합니다

경로를 설정하기 앞서 src -> main -> resources에 위치한 application.properties 파일을 삭제한 뒤 application.yml 파일을 생성하겠습니다.

 

 

application.yml파일을 다음과 같이 작성해줍니다.

 

 

application.yml

spring:
  thymeleaf:
    prefix: classpath:templates/
    suffix: .html
    cache: false #개발
    # cache: true #운영
    enabled: true

 

prefix : 템플릿 기본 경로를 설정합니다.

suffix : Controller에서 .html을 생략하고 경로 설정이 가능합니다.

cache : 개발 과정에서 프로젝트 재실행 없이, 새로고침 만으로 템플릿 수정 내용을 즉시 확인 가능하게 합니다. 운영 반영 시 true로 설정해줍니다.

enabled : 타임리프 사용 여부 설정

 

 

 

templates 폴더 아래에 fragment, layout, view, view\home 파일로 폴더 구조를 설정하겠습니다. 앞으로 모든 화면은 해당 경로에서 만들어진 후 사용자들에게 렌더링될 것입니다. html파일도 다음과 같이 만들어줍니다.