[스프링 입문] #2. 스프링 웹 개발 기초 #28

6om1n · 2024-03-06T10:41:58Z

6om1n
Mar 6, 2024
Maintainer

글을 시작하기 전에

웹을 개발한다는 것은 크게 3가지로 나눌 수 있다.

정적 컨텐츠
- 파일을 그대로 웹브라우저에 내려주는 방식
MVC와 템플릿 엔진
- MVC는 Model, View, Controller 의 약자
- 서버에서 파일을 변형하여 내려주는 방식
API
- json이라는 데이터 구조 포멧으로 클라이언트에게 전달하는 방식

정적 컨텐츠

스프링 부트는 정적 컨텐츠 기능을 제공
https://docs.spring.io/spring-boot/docs/2.3.1.RELEASE/reference/html/spring-boot-features.html#boot-features-spring-mvc-static-content

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>

실행화면
페이지 소스 보기 클릭 시

동작 방식

웹 브라우저에서 localhost:8080/hello-static.html를 치면 내장 톰켓 서버가 요청을 받아 스프링에게 넘긴다.
스프링은 Controller에게 hello-static이 있는지 찾아본다.
즉, 컨트롤러가 먼저 우선순위를 가진다.
그 다음, 내부에 있는 resources/static/hello-static.html을 찾는다.
해당 내용을 웹 브라우저에 전달한다.

정적컨텐츠 정리 !

위에서 페이지 소스보기와 타이핑한 코드가 동일한 것을 알 수 있다.
즉, 정적컨텐츠란 html 코드를 그대로 출력시키는 것을 말한다.

MVC와 템플릿 엔진

Mode 은 코드내의 데이터 집합을 전달해주는 역할 수행
Controller 는 비지니스 로직이나 서버단의 일을 처리
View 는 화면을 그리는 역할 수행

Controller

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

View

resources/templates/hello-template.html

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

실행결과

페이지 소스보기 클릭 시

동작 방식

웹 브라우저에서 주소로 연결되고 내장 톰켓 서버를 거친 다음 스프링으로 전달된다.
helloController에 hello-mvc 메소드가 매핑이 되어있으므로 메소드를 호출한다.
해당 메소드의 return 값인 hello-template으로 (키는 name, 값은 spring)을 넘겨준다.
viewResolver는 templates/hello-template.html 여기서 리턴과 같은 이름을 찾아 thymeleaf 템플릿 엔진에게 넘겨준다.
템플릿 엔진이 렌더링하여 변환한 html을 웹브라우저에 넘긴다.

API

API란 OS나 프로그램 사이의 통신에 사용되는 언어나 메시지 형식을 의미한다.
Json 포맷으로 데이터를 전달하는 것이 API 방식이다.

Controller

 public class HelloController {
    @GetMapping("hello-string")
    @ResponseBody
 public String helloString(@RequestParam("name") String name) {
 return "hello " + name;
    }
 }

@ResponseBody 어노테이션을 사용 할 경우 ViewResolver를 사용하지 않는다.
대신, HTTP의 BODY 부분에 해당 데이터를 넣어주겠다는 의미이다.
실행 결과 localhost:8090/hello-string?name=sping

ResponseBody 객체 반환

 @Controller
 public class HelloController {
    @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;
        }
    }
 }

@ResponseBody 를 사용하고, 객체를 반환하면 객체가 JSON으로 변환된다.
실행 결과 localhost:8090/hello-api?name=spring

Hello 라는 데이터 전송을 위한 객체를 정의하였다.
그 이후 입력 받은 데이터를 hello 객체에 저장하여 반환하였다.
spring은 객체가 오면 json 방식으로 데이터를 반환하는 것을 디폴트 값으로 두기에 위와 같은 실행 결과를 얻을 수 있다.

동작 방식

웹 브라우저에서 요청을 받으면 내장 톰켓 서버는 hello-api 라는 입력을 스프링에 보낸다.
스프링 컨테이너 내부에서 hello-api 라는 Controller를 찾는데, @ResponseBody 라는 어노테이션이 붙어있으면 응답에 그대로 데이터를 넘긴다.
@ResponseBody 를 사용 할 경우 viewResolver 대신 HttpMessageConverter 가 동작한다.
HTTPMessageConverter 가 객체 라면 JsonConverter , 문자열이면 StringConverter 를 거쳐 웹 브라우저에게 전달한다.

YuDeokRin · 2024-03-06T14:13:26Z

YuDeokRin
Mar 6, 2024
Maintainer

정리는 굳굳
반장님 ! 진도 분발 분발~

3 replies

6om1n Mar 6, 2024
Maintainer Author

ㅋㅋㅋㅋㅋㅋㅋ넵 ! 열심히 달려보겠습니다 !!! 아자아자 ..

seyxxn Mar 6, 2024
Maintainer

반장님 걷지말고 뛰어주세요 ~~ hurry up~!

6om1n Mar 6, 2024
Maintainer Author

아직 조깅중 🏃열심히 뛰어볼게요 ㅎㅎ

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Uh oh!

[스프링 입문] #2. 스프링 웹 개발 기초 #28

Uh oh!

{{title}}

Uh oh!

Replies: 1 comment 3 replies

Uh oh!

{{title}}

Uh oh!

Uh oh!

{{title}}

Uh oh!

Uh oh!

{{title}}

Uh oh!

Uh oh!

{{title}}

Uh oh!

Select a reply

Uh oh!

[스프링 입문] #2. 스프링 웹 개발 기초 #28

Uh oh!

6om1n Mar 6, 2024 Maintainer

글을 시작하기 전에

웹을 개발한다는 것은 크게 3가지로 나눌 수 있다.

정적 컨텐츠

정적컨텐츠 정리 !

MVC와 템플릿 엔진

Controller

View

API

Controller

ResponseBody 객체 반환

Replies: 1 comment · 3 replies

Uh oh!

YuDeokRin Mar 6, 2024 Maintainer

Uh oh!

6om1n Mar 6, 2024 Maintainer Author

Uh oh!

seyxxn Mar 6, 2024 Maintainer

Uh oh!

6om1n Mar 6, 2024 Maintainer Author

6om1n
Mar 6, 2024
Maintainer

Replies: 1 comment 3 replies

YuDeokRin
Mar 6, 2024
Maintainer

6om1n Mar 6, 2024
Maintainer Author

seyxxn Mar 6, 2024
Maintainer

6om1n Mar 6, 2024
Maintainer Author