9_yoon
개발저장소
9_yoon
전체 방문자
오늘
어제
  • 분류 전체보기 (101)
    • 알고리즘 (52)
      • BJ (40)
      • 프로그래머스 (0)
      • SWEA (10)
      • JO (2)
    • 이론 공부 (7)
      • 네트워크 (2)
      • 알고리즘 (2)
      • Java (1)
      • Web (1)
      • 기타 (1)
    • 개발 공부 (35)
      • Project (1)
      • JavaScript (1)
      • Typescript (1)
      • Spring (12)
      • Java (2)
      • Next JS (7)
      • React (3)
      • Vue (1)
      • Web (5)
      • 기타 (2)
    • 기타 (7)
      • SSAFY (7)
      • 일상 (0)

인기 글

태그

  • 김영한 스프링
  • NextJS
  • 백준
  • React
  • 노마드코더
  • SSAFY
  • 싸피7기
  • SWEA
  • 싸피
  • 스프링

최근 글

티스토리

반응형
hELLO · Designed By 정상우.
9_yoon

개발저장소

[Spring] 인프런 스프링 입문 강의 정리 #2
개발 공부/Spring

[Spring] 인프런 스프링 입문 강의 정리 #2

2022. 4. 17. 16:43
728x90
반응형

 

 

[무료] 스프링 입문 - 코드로 배우는 스프링 부트, 웹 MVC, DB 접근 기술 - 인프런 | 강의

스프링 입문자가 예제를 만들어가면서 스프링 웹 애플리케이션 개발 전반을 빠르게 학습할 수 있습니다., - 강의 소개 | 인프런...

www.inflearn.com

글에서 나오는 모든 코드와 사진들은 김영한님의 인프런 스프링 입문 강의에서 가져온 것임을 미리 알립니다.


 

정적 컨텐츠

서버에서 하는 거 없이 파일을 그대로 웹브라우저에 내려주는 것.

 

staic폴더 안에 html 파일 생성해주고 다음과 같이 작성 

src/main/resources/static/hello-static.html 

<!DOCTYPE HTML>
<html>
<head>
    <title>static content</title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
</head>
<body>
정적 컨텐츠 입니다.
</body>
</html>

 

그리고 http://localhost:8080/hello-static.html 접속해보면 

다음과 같은 화면을 볼 수 있다.

 

큰 틀에서 구조를 보자면 

1. 웹 브라우저에서 url을 입력하면 내장 톰켓 서버에서 요청을 받는다.

2. 톰켓 서버는 스프링에게 요청을 넘긴다.

3. 스프링은 controller 쪽에서 hello-static이 있는지 먼저 찾아본다. -> 있다면 반환

4. 없으면 resource로 가서 hello-stastic을 찾는다. -> 있다면 반환해준다.

 

MVC와 템플릿 엔진

MVC: Model, View, Controller 세 개로 나눠서 동작하는 원리

기존에는 View에서 Controller의 기능까지 다 구현(jsp)했음. (Model 1 방식)

지금은 Model, Controller는 내부적으로 비지니스 로직을 처리하는데 집중하고, View는 화면 설계 및 보여지는 것에 집중함. (Model2방식. 현재는 Model2방식을 사용한다.) 

 

HelloController.java에 다음 코드 추가

@GetMapping("hello-mvc")
    public String helloMvc(@RequestParam("name") String name, Model model){
        model.addAttribute("name", name);
        return "hello-template";
    }

 

templete 폴더 안에 hello-template.html 생성 후 추가

<html xmlns:th="http://www.thymeleaf.org">
<body>
<p th:text="'hello ' + ${name}">hello! empty</p>
</body>
</html>

 

<p th:text="'hello ' + ${name}">hello! empty</p>

 이 코드에서 hello! empty에 있는 부분은 서버가 돌아가지 않고, 정적인 페이지로 열었을 경우 나타난다. 만약 서버에서 돌아간 후 열린다면 th:text 안에 있는 문자열이 나타난다.

그리고 http://localhost:8080/hello-mvc?name=spring!!! 을 입력하면 다음과 같은 화면이 뜬다.

아까 controller에서 name을 파라미터로 가져오라고 작성했기 때문에 ?뒤에 있는 쿼리 스트링에 name이 있으므로 해당 값을 가져와서 model에 넣어주고, hello-template의 ${name}은 model안에서 name 이름을 가진 변수의 값을 가져와서 안에 넣어준다.

 

순서를 보면

1. 웹브라우저에서 요청 url을 톰켓에 보낸다.

2. 톰켓은 controller에서 요청을 보내고, url에 맞는 메소드를 매핑해준다.

@GetMapping("hello-mvc")

url이 .../hello-mvc?...이기 때문에 위와 같이 적혀있는 메소드를 실행한다.

3. 메소드가 모델에 변수를 지정해주고, hello-template을 리턴한다.

4. viewResolver는 화면과 관련된 일을 하는데 뷰를 찾아주고 템플릿엔진을 연결시켜준다.

5.해당 html을 찾아서 Thymeleaf 엔진에게 전달하면 엔진은 렌더링해서 변환한 html을 웹브라우저에 넘겨준다.

 

API

1. html을 줄 것인지

2. api를 사용해서 줄 것인지

두가지 방법이 존재하는데 우리는 API를 사용해서 주는 방법을 볼 것이다.

 

controller(HelloController.java)에 다음 부분을 추가한 뒤 , http://localhost:8080/hello-string?name=spring을 접속해보면 

    @GetMapping("hello-string")
    @ResponseBody //http의 응답 body부분에 반환값을 넣어주겠다는 의미
    public String helloString(@RequestParam("name") String name, Model model){
        return "hello "+name;
    }

다음과 같은 화면이 나온다. 위에서 작성한 helloMvc메소드와 차이점은 html을 거치지 않고 바로 데이터를 보내는 것이다. 그래서 두개의 메소드를 실행하고 페이지 소스보기를 보면 다음과 같이 차이가 있다.

hello-mvc / hello-string

 

controller에 추가

    @GetMapping("hello-api")
    @ResponseBody
    public Hello helloApi(@RequestParam("name") String name){
        Hello hello = new Hello();
        hello.setName(name);
        return hello;
    }
    static class Hello{
        private String name;

        public String getName() {
            return name;
        }
        public void setName(String name) {
            this.name = name;
        }
    }

이번엔 객체를 생성해서 객체를 반환하는데 그 결과는 웹페이지에 json형식으로 객체가 표시된다. 객체는 자바 beans 형식을 따라 getter와 setter를 만들어서 값을 대입하고, 가져올 땐 getter, setter를 사용한다.

 

페이지소스보기도 동일하게 나온다.

 

 

동작 원리는 위와 비슷한데 차이점은 

controller에서 메소드를 매칭하는데 @ResponseBody 라는 annotation이 있기 때문에 http body부분에 직접 반환해야한다고 미리 인지한다.

만약 객체가 온다면 기본 설정이 객체를 json형태로 변환 후 반환하는 것이 기본 정책이며, 

@ResponseBody가 있으면 HttpMessageConverter가 동작을 하는데 만약 문자열이면 StringConverter을 사용하고, 객체면 JsonConverter를 사용한다. 

728x90
반응형
저작자표시 비영리 동일조건 (새창열림)

'개발 공부 > Spring' 카테고리의 다른 글

[Spring] 인프런 스프링 입문 강의 정리 #5  (0) 2022.06.26
[Spring] 인프런 스프링 입문 강의 정리 #4  (0) 2022.06.25
[Spring] 인프런 스프링 입문 강의 정리 #3  (0) 2022.06.23
[Spring] JAVA에서 Spring으로 변환 정리 (개인 공부 정리용)  (0) 2022.04.22
[Spring] 인프런 스프링 입문 강의 정리 #1  (0) 2022.03.04
    '개발 공부/Spring' 카테고리의 다른 글
    • [Spring] 인프런 스프링 입문 강의 정리 #4
    • [Spring] 인프런 스프링 입문 강의 정리 #3
    • [Spring] JAVA에서 Spring으로 변환 정리 (개인 공부 정리용)
    • [Spring] 인프런 스프링 입문 강의 정리 #1
    9_yoon
    9_yoon
    배울게 넘쳐나는 개발 세상에서 묵묵히 걸어가며 지식을 쌓는 신입 개발자

    티스토리툴바