Spring Boot STEP 3 - Thymeleaf

★ 새 프로젝트 생성

New > Spring Starter Project
- Name > boot-mybatis
- Type > Maven
- Packaging > Jar
- Java Version > 11
- Language > Java
- Group > com.test
- Aritfact > boot-mybatis
- Package > com.test.mybatis
- srping boot version > 2.7.13
- Spring Web > 체크
- Oracle Driver > 체크
- MyBatis Framwork > 체크
- Lombok > 체크

 

■ JSP 설정

1. pom.xml > 의존성 2개 추가

<dependency>
 <groupId>javax.servlet</groupId>
 <artifactId>jstl</artifactId>
</dependency>

<dependency>
 <groupId>org.apache.tomcat.embed</groupId>
 <artifactId>tomcat-embed-jasper</artifactId>
</dependency>

2. application.properties > ViewResolver

#서버 포트 번호
server.port = 8092

# JSP View Resolver
spring.mvc.view.prefix=/WEB-INF/views/
spring.mvc.view.suffix=.jsp

# HikariCP settings
spring.datasource.hikari.minimumIdle=5
spring.datasource.hikari.maximumPoolSize=20
spring.datasource.hikari.idleTimeout=30000
spring.datasource.hikari.maxLifetime=2000000
spring.datasource.hikari.connectionTimeout=30000

spring.datasource.driver-class-name=oracle.jdbc.OracleDriver
spring.datasource.url=jdbc:oracle:thin:@localhost:1521:xe
spring.datasource.username=hr
spring.datasource.password=java1234

# MyBatis
mybatis.mapper-locations=classpath:mapper/*.xml

3. views 폴더 추가

src > main > webapp > WEB-INF > views

 

■ 파일 생성

- com.test.mybatis
- com.test.mybatis.controller > 스캔 필요(X)
- com.test.controller > servlet-context.xml(X)

- com.test.controller > MyBatisController.java
- com.test.mapper > MyBatisMapper.java(I)

- src/main/resources
	> com > test > mapper > MyBatisMapper.xml
    
- src/test/java > 기본패키지 > MapperTest.java

 

■ 코드 작성

• MyBatisController.java -> 컨트롤러, 가상주소 매핑

@Controller
public class MyBatisController {

	@GetMapping("/ex01.do")
	public String ex01() {
		
		return "ex01";
	}
	
}

• BootMyBatisApplication.java -> 스캔 추가

@ComponentScan(basePackages = {"com.test.controller"})
@MapperScan(basePackages = {"com.test.mapper"})

• MyBatisMapper.xml

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE mapper PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN" "http://mybatis.org/dtd/mybatis-3-mapper.dtd">

<mapper namespace="com.test.mapper.MyBatisMapper">
	
    <select id="time" resultType="String">
		select sysdate from dual
	</select>
    
</mapper>

• MapperTest.java

@SpringBootTest
@Slf4j
public class MapperTest {

	@Autowired
	private MyBatisMapper mapper;
	
	@Test
	public void testMapper() {
		
		log.info(mapper.time());
		
	}
}

 

★ 새프로젝트 생성

New > Spring Starter Project
- Name > boot-thymeleaf
- Type > Maven
- Packaging > Jar
- Java Version > 11
- Language > Java
- Group > com.test.thymeleaf
- Aritfact > boot-mybatis
- Package > com.test.thymeleaf
- srping boot version > 2.7.13
- Spring Web > 체크
- Oracle Driver > 체크
- MyBatis Framwork > 체크
- Lombok > 체크
- Thymeleaf > 체크

 

■ 기초 셋팅

• application.properties

#서버 포트 번호
server.port = 8092

# HikariCP settings
spring.datasource.hikari.minimumIdle=5
spring.datasource.hikari.maximumPoolSize=20
spring.datasource.hikari.idleTimeout=30000
spring.datasource.hikari.maxLifetime=2000000
spring.datasource.hikari.connectionTimeout=30000

spring.datasource.driver-class-name=oracle.jdbc.OracleDriver
spring.datasource.url=jdbc:oracle:thin:@localhost:1521:xe
spring.datasource.username=hr
spring.datasource.password=java1234

# Thymeleaf
spring.thymeleaf.enabled=true
spring.thymeleaf.prefix=classpath:/templates/

spring.thymeleaf.suffix=.html

# cache 활성화 > 개발시에는 false
spring.thymeleaf.cache=false

spring.thymeleaf.encoding=UTF-8

• 파일 생성

com.test.controller > ThymeleafController.java
com.test.mapper > ThymeleafMapper.java(I)
src/main/resources > com > test > mapper > ThymeleafMapper.xml

com.test.domain > BoardDTO.java

 

■ 코드 작성

• BootThymeleafApplication.java -> 스캔 추가

@ComponentScan(basePackages = "com.test.controller")
@MapperScan(basePackages = "com.test.mapper")

• ThymeleafController.java -> 컨트롤러 추가

@Controller
public class ThymeleafController {

	@Autowired
	private ThymeleafMapper mapper;
	
	@GetMapping("/m1")
	public void m1() {
		
		//요청 메소드의 반환 값 > void > m1.jsp 호출
		//요청 메소드의 반환 값 > void > m1.html 호출
		System.out.println("m1");
	}
	
}

 

■ 다양한 예제

• m1() -> 기본 사용

--------------------------------ThymeleafController.java ---------------------------------
@GetMapping("/m1")
public void m1() {

    //요청 메소드의 반환 값 > void > m1.jsp 호출
    //요청 메소드의 반환 값 > void > m1.html 호출
    System.out.println("m1");
}
--------------------------------m1.html---------------------------------------------------
<h1>Thymeleaf</h1>
http://localhost:8092/m1

• m2() -> 파일이 2개일경우, 우선 순위는 Thymeleaf

--------------------------------ThymeleafController.java ---------------------------------
/페이지 요청
//1. 동적 페이지("m2.html") > localhost:8092/m2.html
//2. 정적 페이지("m2.html") > localhost:8092/m2.html

@GetMapping("/m2")
public String m2() {

    System.out.println("m2");

    //templates > m2.html
    return "m2";
}
--------------------------------m2.html---------------------------------------------------
<h1>Thymeleaf</h1>
<div>m2.html</div>

• Thymeleaf

Thymeleaf Standard Expression, 타임리프 표현식 

1. Variable Expression, 변수 표현식
    - ${}
    - 컨트롤러 -> 전달된 값 -> 출력 

2. Selection Variable Expression, 선택 변수 표현식
    - *{}
    - 객체/맵 프로퍼티 > 출력
    - th:object 속성과 같이 사용

3. Message Expression, 메시지 표현식
    - #{}
    - 스프링 메시지 > 전용 출력

4. Link URL Expression, 링크 주소 표현식 
    - @{}
    - 링크의 URL > 전용 출력

5. Fragment Expression, 조각 표현식 
    - ~{}
    - 조각 페이지 삽입(include 지시자 or 타일즈 > 유사)

타임리프 > th:XXX 속성

• m3() -> DB 사용, 단일 값 출력

--------------------------------ThymeleafController.java ---------------------------------
/페이지 요청
//1. 동적 페이지("m2.html") > localhost:8092/m2.html
//2. 정적 페이지("m2.html") > localhost:8092/m2.html

@GetMapping("/m3")
public String m3(Model model) {

    //단일값 출력
    int num = mapper.getNum();
    String txt = mapper.getTxt();
    BoardDTO dto = mapper.getDTO();

    model.addAttribute("num", num);
    model.addAttribute("txt", txt);
    model.addAttribute("now", Calendar.getInstance());
    model.addAttribute("dto", dto);

    return "m3";
}
--------------------------------ThymeleafMapper.java --------------------------------------
int getNum();
String getTxt();
BoardDTO getDTO();
--------------------------------ThymeleafMapper.xml --------------------------------------
<select id="getNum" resultType="Integer">
    select salary from employees where rownum = 1
</select>

<select id="getTxt" resultType="String">
    select first_name from employees where rownum = 1
</select>

<select id="getDTO" resultType="com.test.domain.BoardDTO">
    select * from tblBoard where rownum = 1
</select>
--------------------------------m3.html---------------------------------------------------
<h2>변수 표현식</h2>
	 
<div>${num}</div>

<div th:text="${num}"></div>
<div th:text="100"></div>

<h2>타입별</h2>

<div>숫자: 100</div>
<div th:text="${num}">숫자: </div>

<div>숫자: <span th:text="${num}"></span></div>
<div>문자: <span th:text="${txt}"></span></div>
<div>객체: <span th:text="${dto}"></span></div>
<div>맵: <span th:text="${map}"></span></div>

<!-- 변수 표현식 -->
<h2>복합 데이터(객체, 맵) 프로퍼티</h2>
<div>제목: <span th:text="${dto.getSubject()}"></span></div>
<div>제목: <span th:text="${dto.Subject}"></span></div>
<div>아이디: <span th:text="${dto.id}"></span></div>
<div>날짜: <span th:text="${dto.regdate}"></span></div>

<!-- 선택 변수 표현식 -->
<div th:object="${dto}">
    <div>제목: <span th:text="*{subject}"></span></div>
    <div>아이디: <span th:text="*{id}"></span></div>
    <div>날짜: <span th:text="*{regdate}"></span></div>
</div>

<hr>
	 
<div th:text="${map.get('dog')"></div>
<div th:text="${map.dog"></div>
<div th:text="${map.cat"></div>

<div th:object="${map}">
	<div th:text="*{dog}"></div>
	<div th:text="*{cat}"></div>
</div>

 

■ 실행 결과