정적 페이지
정적 페이지는 말 그대로 프로그래밍이 들어가 있지 않은 순수 HTML 페이지를 이야기한다. Spring에서는 이러한 정적 페이지를 src/main/resources/static 경로에 위치시켜 리턴해 줄 수 있도록 지원하고 있다.
아래 이미지의 index.html은 Spring에서 제공하는 Welcome Page이고, static-page.html은 내가 임의로 생성한 html이다.
http://localhost:8080/ 으로 진입하면 src/main/resources/static/index.html 페이지를 리턴하고,
http://localhost:8080/static-page.html 으로 진입하면 src/main/resources/static/static-page.html 페이지를 리턴해 준다.
동적 페이지
동적 페이지를 만들기 위해서는 템플릿 엔진이 필요하다. Spring에서 지원하는 다양한 템플릿 엔진이 존재하는데, 나는 thymeleaf를 선택해서 사용하고 있다. 동적 페이지를 만들기 위해서 src/main/java/ 디렉토리 안에 Controller 패키지를 만들고 HelloController 파일을 생성한 후 아래와 같이 코드를 작성했다.
// src/main/java/hello.hellospring/controller/HelloController.java
package hello.hellospring.contoller;
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){
model.addAttribute("data", "Hello Spring~!!");
return "hello";
}
}그리고 src/main/resources/templates 디렉토리 안에 hello.html 파일을 생성한 후 아래와 같이 코드를 작성했다.
<html xmlns:th="http://www.thymeleaf.org">는 템플릿 엔진인 thymeleaf 문법을 사용할 수 있게 해주는 코드이고,
<p th:text="congrats :' + ${data}" > HaHa</p> 는 HelloController에서 작성한 attributeName의 "data"로 가서 attributeValue인 Hello Spring~!!" 으로 치환시켜주는 코드이다.
<!DOCTYPE HTML>
<html xmlns:th="http://www.thymeleaf.org">
<head>
<title>Hello</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
</head>
<body>
<p th:text="congrats :' + ${data}" > HaHa</p>
</body>
</html>
동작 원리
- 웹 브라우저에서 http://localhost:8080/hello 를 요청한다.
- 스프링 부트가 내장하고 있는 톰켓 서버가 스프링 컨테이너에 작성된
@GetMapping("hello")를 찾아서 메서드를 실행한다.
@Controller
public class HelloController {
@GetMapping("hello")
public String hello(Model model){
model.addAttribute("data", "Hello Spring~!!");
return "hello";
}
}- 메서드에서 return "hello"; 이므로
View Resolver를 통해 templates/hello.html을 찾아간다. - hello.html 에 작성된
${data}는 모델이 넘겼던 키 값("data")을 받아 키의 밸류인"hello Spring~!!"로 치환된다. - 결과
