뚜룽

[Spring] 인프런 스프링 입문 정리 (2) / 페이지 만들기 본문

Spring

[Spring] 인프런 스프링 입문 정리 (2) / 페이지 만들기

ddooroong 2023. 10. 8. 22:17

목차

  1. welcom page 만들기
  2. hello 페이지 만들기
  3. Spring의 동작 방식 (아주 간략하게)

 

 

1. 정적 페이지 만들기

 
  • 경로: main > resources > static 
  • index.html 파일 생성
    • html 파일을 작성하여 맨 처음 도메인을 호출했을 때 보여줄 정적 페이지를 만든다. 

 

2. hello 페이지 만들기

 

2.1 Controller 생성

실제로 클라이언트가 요청한 URL에 따라 동작하는 페이지를 만들어보자. 먼저 Controller 역할을 하는 파일을 하나 만든다.

  • 경로: main > java > hello.hellospring
  • hello.hellospring.controller 패키지 생성
    • HelloController.java 파일 생성

이렇게 구성이 되도록 만들어주면 된다. 

Controller 파일의 위치

 

그 다음엔 어노테이션을 붙여준다. @Controller와 @GetMapping 어노테이션을 사용해서 URL의 주소에 따라 알맞 메소드가 호출되도록 의미를 부여해준다. 

package hello.hellospring.controller;

import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.GetMapping;

@Controller
public class HelloController {

// 웹 어플리케이션에서 /hello라는 URL을 요청하면 이 메소드를 호출한다.
    @GetMapping("hello")	
    public String hello(Model model) {
        model.addAttribute("data", "hello!");
        return "hello";
    }
}

2.2 View 생성

Controller로 hello라는 요청을 처리할 메소드를 지정해주었다. 그러면 이제 hello라는 브라우저의 요청에 응답할 페이지를 만들어주어야 한다. 이런 역할을 담당하는 것이 MVC 모델의 View이다. 다음과 같이 html 파일을 새로 만든다.

  • 경로: main > resources > templates
  • hello.html 파일 생성 (controller가 return 한 값과 동일한 이름의 html을 만들어 controller와 view를 매핑시키는 것)

 

Controller에서 model.addAttribute(key, value) 문법에 따라 data라는 key값에 'hello!'라는 문자열을 저장했다. 그 data를 브라우저 화면에 표시하도록 코드를 작성한다.

<!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>

이때 <html xmlns:th="http://www.thymeleaf.org"> </html> 은 템플릿 엔진인 타임리프의 문법을 사용할 수 있게 해주는 문장이다. <p> 태그의 th:text가 타임리프에서 제공하는 문자열을 사용하고 있는 것이다. 그럼 ${data} 부분에는 key값에 들어있는 value가 매핑되어 html 문서에 랜더링 되면서 화면에 나타나게 된다.

 

3. Spring 동작 방식 (아주 간략하게)

 

 Controller가 특정 url의 요청을 받아서 알맞은 메소드를 호출하면, 스프링은 해당 메소드에 Model이라는 것을 부여하고, 그 모델 안에 key:value 형태로 어떠한 값을 넣는다. 그리고 문자열 하나를 리턴하는데,  메소드가 return 한 이름의 html 파일을 resource > templates 폴더에서 찾아서 브라우저에 출력하는 방식으로 페이지가 만들어진다. 이때 model에 저장한 key:value 중에서 value는 DB로부터 가져온 결과값이라든지, 아니면 임의로 넣어준 값이라든지 여러가지 형태가 될 수 있다. 

 

저작자표시 비영리 변경금지

'Spring' 카테고리의 다른 글

[Spring] 인프런 스프링 입문 정리 (4) / API  (1) 2023.10.09
[Spring] 인프런 스프링 입문 정리 (3) / MVC 모델  (0) 2023.10.09
[Spring] 스프링 인프런 입문 정리 (1) / Java 설치, Spring 프로젝트 시작하기  (0) 2023.10.08
'Spring' Related Articles more