| MVC 패턴
MVC 패턴은 각각 Model, View, Controller 역할을 나누는 기법입니다.
- Model : 데이터를 관리하는 역할
- View : 화면을 담당하는 역할
- Controller : 클라이언트의 요청에 따라 서버에서 처리하는 역할
| 뷰 템플릿
뷰 템플릿은 화면을 담당하는 기술
웹 페이지 (View)를 하나의 틀 (Templete)으로 만들고 여기에 변수를 삽입해
서로 다른 페이지로 보여준다.
ex) 웹 사이트의 같은 틀에서 사용자마다 다른 내용을 보여주는 것
| 예제) MVC 패턴을 활용해 페이지 만들기
| 뷰 템플릿 페이지 만들기
뷰 템플릿은 html 파일이 있는 static 디렉터리가 아닌 templates 디렉터리에 만듭니다.
templates 디렉터리에 .mustache 파일 확장자로 만들었습니다.
.mustache 확장자는 뷰 템플릿 엔진을 의미하며 플러그인을 발견했다고 알람을 띄우고 설치했습니다.
mustache 파일에서 doc를 입력한 다음 tab 키를 누르면 HTML 기본 코드가 자동으로 작성되며
<h1></h1>에 본문을 추가했습니다.
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Document</title>
</head>
<body>
<h1>준세님 반갑습니다.</h1>
</body>
</html>
| 컨트롤러 만들고 실행하기
컨트롤러 파일은 src > main > java 디렉터리에 새로운 패키지로 만듭니다.
Java Class를 생성하여 컨트롤러임을 선언하는 @Controller 어노테이션을 작성합니다.
또한 URL 요청을 접수하기 위한 @GetMapping()을 추가하여 URL 주소를 추가합니다.
| 실행 locolhost:8080/hi
처음에 결과를 보고 한글 깨짐 현상이 발생하여 봤더니 책 TIP에 해당 내용이 있더라구요
properties 파일에서 코드를 추가하여 재실행하니 한글이 깨지지 않았습니다!
| 모델 추가하기
이제 뷰의 머스테츠 문법을 사용해 뷰 템플릿 페이지에 변수를 삽입하고
모델을 활용하여 컨트롤러의 메서드에서 매개변수로 받아와 처리하는 방법에 대해 알아보겠습니다.
컨트롤러에서 메서드에 Model 타입의 매개변수를 추가합니다.
모델에서 변수를 등록할 때는 addAttribute() 메서드를 사용하여 추가합니다.
코드)
public String niceToMeetYou(Model model)
{
model.addAttribute("username", "Junse");
return "Greetings";
}
결과)
| 마무리
2장 MVC 패턴의 이해와 실습을 정리했습니다.
결론적으로 MVC 패턴은 클라이언트의 요청을 모델, 뷰, 컨트롤러가 역할을 분담에 처리하는 것이고
컨트롤러가 요청을 받고 뷰가 페이지를 만들며, 모델이 데이터를 뷰에 전달하는 형식이었습니다.
2장의 끝까지 했을 때 뷰 템플릿 페이지에 레이아웃을 추가하는 예제가 있으며
부트스트랩을 활용해 손쉽게 추가할 수 있었습니다.
'JAVA > 코딩자율학습-스프링부트' 카테고리의 다른 글
[코딩 자율학습 스프링부트] 7장 게시글 수정하기 : Update (0) | 2024.11.30 |
---|---|
[코딩 자율학습 스프링부트] 6장 게시판 내 페이지 이동하기 (0) | 2024.11.29 |
[코딩 자율학습 스프링부트] 5장 게시글 읽기 : Read (0) | 2024.11.28 |
[코딩 자율학습 스프링부트] 3장 게시판 만들고 새 글 작성 : Create (0) | 2024.11.27 |
[코딩 자율학습 스프링부트] 1장 스프링 부트 시작하기 (0) | 2024.11.25 |