[Spring] 2. 웹 개발 기초

15433 단어 webSpringMVCMVC

⌜스프링 입문 - 코드로 배우는 스프링 부트, 웹 MVC, DB 접근 기술⌟(김영한, 인프런)
(강의 자료를 요약 및 발췌하였고, 김영한 강사님께 양해를 구한 후 작성했습니다.)

웹 개발 방식

정적 콘텐츠

  • 서버에서 동작 없이 파일을 그대로 내려주는 것
  • 웰컴 페이지

MVC와 템플릿 엔진

  • jsp, php 에서 html 을 동적으로 내려주는 것
  • model, template(view), controller -> MVC
  • 서버에서 html 변형해서 내려주는 것

API

  • 안드로이드, 아이폰 클라이언트와 JSON 이라는 데이터 포맷으로 소통
  • Vue, React 로 데이터만 내려주면 클라이언트가 알아서 그린다.
  • 서버끼리 통신할 때와 같이 html 이 아닌 데이터만 필요할 때 적용한다.

정적 콘텐츠

controller

java/hello/hellospring/controller/HelloController.java

@Controller
public class HelloController {

    @GetMapping("hello")
    public String hello(Model model) {
        model.addAttribute("data", "hello!!");
        return "hello"; // resources/templates/"hello" 찾아서 렌더링
    }
}

resources/static

  • 하위에 있는 html 파일 그대로 응답

resources/static/hello-static.html

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

동작


1. 검색창에서 http://localhost:8080/hello-static.html
2. 내장 톰캣 서버가 요청을 받아 스프링에 넘긴다.
3. controller 에서 hello-static 과 맵핑되는 것 있는지 확인
4. 없으면, resouces/static 에서 확인하여 그대로 반환

MVC 와 템플릿 엔진

MVC

  • Model: 애플리케이션의 정보(데이터)를 나타내며
  • View: 텍스트, 체크박스 항목 등과 같은 사용자 인터페이스 요소
  • Controller: 데이터와 비즈니스 로직 사이의 상호동작을 관리
  • 참고) wiki - 모델-뷰-컨트롤러

Controller

java/hello/hellospring/controller/HelloController.java

@Controller
public class HelloController {

    @GetMapping("hello")
    public String hello(Model model) {
        model.addAttribute("data", "hello!!");
        return "hello"; // resources/templates/"hello" 찾아서 렌더링
    }

    @GetMapping("hello-mvc")
    public String helloMvc(@RequestParam(value = "name") String name, Model model) {
        model.addAttribute("name", name);
        return "hello-template";
    }
    // 단축키: 커맨드 + P -> 파라미터 정보 볼 수 있다.
    // required true 이면 기본으로 값을 넘겨야 한다.
    // http://localhost:8080/hello-mvc?name=spring!!!!!! -> hello spring!!!!!! 출력
}

html

resources/templates/hello-template.html

<html xmlns:th="http://www.thymeleaf.org">
<body>
<!-- $ 는 Model 에서 값을 꺼낸다. -->
<p th:text="'hello ' + ${name}">hello! empty</p>
<!-- absolute path 로 검색창에 복사해서 치면 -> html 을 서버 없이 그대로 봐도 결과물을 볼 수 있다. -->
<!-- 서버가 동작하면 값으로 치환된다. -->
</body>
</html>

동작


1. 검색창에서 http://localhost:8080/hello-mvc?name=spring
2. 내장 톰캣 서버가 요청을 받아 스프링에 넘긴다.
3. controller 에서 hello-mvc 와 매핑되는 것을 찾고 "hello-template" 반환
4. viewResolver(view 찾고 템플릿 엔진 연결시켜줌) 에서 templates/hello-template.html (Thymeleaf 템플릿 엔진 처리)
5. 렌더링 된 html 을 클라이언트에 전달한다.

API

Controller

java/hello/hellospring/controller/HelloController.java

@Controller
public class HelloController {
    @GetMapping("hello-api")
    @ResponseBody   // 객체 반환하고 응답으로 지정하면 기본이 JSON 형식으로 반환 지정, xml 로 바꾸는 것도 가능하지만 비추
    public Hello helloApi(@RequestParam("name") String name) {
        Hello hello = new Hello();
        hello.setName(name);
        return hello;
        // JSON 으로 반환 {"name":"spring!!!"}
    }

    static class Hello {
        private String name;

        // 자바 bean 규약
        // command + N > Getter and Setter 로 자동 생성
        public String getName() {
            return name;
        }

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

동작


1. 검색창에서 http://localhost:8080/hello-api
2. 내장 톰캣 서버가 요청을 받아 스프링에 넘긴다.
3. controller 에서 @ResponseBody 확인하여 http 응답에 그대로 넘겨야 한다는 것을 인지한다.
4. HttpMessageCoverter 가 동작한다. (앞의 viewResolver 대신)
5. http response 에 값을 넣어 반환한다.

HttpMessageConverter

  • 기본 문자라면, StringCoverter(StringHttpMessageCoverter) 동작한다.
  • 기본 객체라면, JsonCoverter(MappingJackson2HttpMessageConverter) 동작한다.
  • byte 등 여러 포맷에 대한 처리 HttpMessageConverter 기본 등록되어 있다.

참고

  • 객체 to JSON 라이브러리 종류
    • Jackson: Spring default
    • GSON
  • 클라이언트 http 요청할 때 Accept 헤더에서 받고 싶은 포맷(xml, json 등) 지정하는 경우, 해당 포맷 converter 가 동작한다.

소스 코드

부트스트랩 5 팝오버
Git-flow 사용 노트

좋은 웹페이지 즐겨찾기

개발자 우수 사이트 수집

개발자가 알아야 할 필수 사이트 100선 추천 우리는 당신을 위해 100개의 자주 사용하는 개발자 학습 사이트를 정리했습니다
best100-homepage