View Template & MVC

1. View Template 

출처 : https://thebook.io/080354/0058/

○ 화면을 담당하는 기술로, 웹 페이지(view)를 하나의 틀(template)로 만듬

○ 여기에 변수를 삽입해 서로 다른 페이지로 보이게 함

○ 1장에서 설치한 Mustache가 바로 이러한 뷰 템플릿 생성 도구

○ 간단하게 View라고 지칭

 

즉, View란? 하나의 틀(template)와 변수를 이용해 서로 다른 페이지로 보이게 하는 것

 

2. MVC 패턴

출처 : https://huimang2.github.io/design-pattern/mvc-pattern

○ View는 컨트롤러(Controller)와 모델(Model)이라는 두 동료가 존재함

○ 컨트롤러는 클라이언트의 요청에 따라 서버에서 이를 처리하는 역할

○ 모델은 데이터를 관리하는 역할

○ 웹 페이지를 보여주고(View), 클라이언트의 요청을 받아 처리하고(Controller), 데이터를 관리(Model)

○ 이를 MVC 패턴(Model-View-Controller Pattern)이라고 함

 

2. 컨트롤러(Controller) 만들고 실행하기

mustache 파일 생성

 

데이터 작성

 

컨트롤러 생성1

 

컨트롤러 생성2

 

컨트롤러 생성3

○ 해당 클리스가 컨트롤러임을 선언하는 @Controller 어노테이션을 작성

○ Controller 클래스 패키지(org.springframework.stereotype.Controller)가 자동으로 임포트

○  이후 반환형이 문자열인 niceToMeetYou() 메서드 선언

 

○ 어노테이션(annotation)이란 소스 코드에 추가해 사용하는 메타 데이터의 일종
    ● 메타 데이터는 프로그램에서 처리해야 할 데이터가 아님

    ● 컴파일 및 실행 과정에서 코드를 어떻게 처리할지 알려 주는  추가 정보

    ● 자바에서 어노테이션은 @기호를 붙여 사용함

 

컨트롤러 생성4

 

 

hi 페이지 접근

 

인코딩 변경

 

hi 페이지 접근2

 

4. 모델(Model) 추가하기

mustache 파일에 변수 추가

○ 머스테치 문법을 사용해 뷰 템플릿 페이지에 변수를 삽입할 수 있음 {{변수명}}

 

컨트롤러에 모델 추가

○ 모델은 컨트롤러의 메서드에서 매개 변수로 받아옴

○ niceToMeetYou() 메서드에 Model 타입의 model 매개변수를 추가

○ 그러면 Model 클래스 패키지가 자동으로 임포드 되는 것을 확인 가능

○ Model 클래스 패키지가 임포트 됐다면 모델을 통해 변수를 등록할 수 있음

○모델에서 변수를 등록할 떈 addAttribute() 메서드를 사용 

 

addAttribute를 이용해 변수 추가

 

hi 페이지 확인3

 

5. MVC 복습하기

 

mustache 파일 생성

 

컨트롤러 및 모델 생성

 

출력 확인