BACKEND/JAVA & SPRING

[J2KB] Spring View 환경설정

이-프 2023. 2. 3. 18:26

Spring을 통해 웹페이지를 생성해본다. 

 

Spring에서는 기본적인 페이지들에 관련한 코드들을 홈페이지에서 제공한다.

예를 들어, Hello와 같은 기본 index.html 파일은 아래 페이지에서 검색하여 확인할 수 있다. 

https://docs.spring.io/spring-boot/docs/current/reference/html/web.html#web  

 

 

 

Template Engines 

템플릿 양식과 특정 데이터 모델에 따른 입력 자료를 합성하여 결과 문서를 출력하는 소프트웨어 

(즉, 지정된 템플릿 양식 + 데이터 => html문서 출력)

 

이와 같은 Template engines들도 위 페이지에서 확인 가능하다. 

그중, 가장 자주 사용하는 thymeleaf에 대해서도 확인가능하다. 

 

Thymeleaf

view template이라고도 불리는 템플릿 엔진

 

웹화면은 controller를 가장 먼저 거친다.

이때, controller에서 전달하는 데이터를 이용하여 동적화면을 구성하게 해주는 것이 thymeleaf이다. 

 


View 정리

 

main/java/com.example/hellospring/controller(패키지)/HelloController

package com.example.hellospring.controller;


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!!");
        return "hello";
    }
}

Controller에서 hello란 모델에 data란 오브젝트에 hello!!를 대입한다.

 

controller에서 return "hello"란 templates의 hello.html로 이동하라는 의미이다.

즉, 리턴으로 문자를 반환시 뷰리졸버(viewResolver)가 화면을 찾아서 처리해준다. 

 

문자를 viewName이라 하고 한줄로 정리하면 아래와 같다. 

resources:templates/ + {viewName}.html

 

이때, model(data:hello!!)를 갖고 hello.html로 이동한다.

 

 

resources/templates/hello.html

<!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="'안녕하세요. ' + ${data}" >안녕하세요. 손님</p>
</body>
</html>

hello.html에서 ${data}에 controller에서 가져온 model(data:hello!!)을 대입해준다. 

 

 

 

실제로 웹 실행을 해보면, data부분에 hello!!가 대입되어 출력됨을 확인할 수 있다.

 


이를 정리하면 아래 사진과 같다.

 

출처 : 인프런 스프링부트 강의자료

 

'BACKEND > JAVA & SPRING' 카테고리의 다른 글

[J2KB] API  (0) 2023.02.10
[J2KB] MVC와 템플릿 엔진  (1) 2023.02.10
[J2KB] 정적 컨텐츠  (0) 2023.02.10
[J2KB] SPRING 라이브러리  (0) 2023.02.03
[J2KB] 프로젝트 환경설정  (1) 2023.02.03