Back end/SpringBoot
뷰 템플릿과 MVC 패턴
jinpark1992
2023. 11. 29. 13:15

- MVC 패턴 (Model-View-Controller): MVC는 소프트웨어 디자인 패턴으로, 소프트웨어를 세 가지 구성 요소로 분리하여 개발하는 방법론입니다. 각 구성 요소는 다음과 같습니다: 1. Model (모델):** 데이터와 비즈니스 로직을 담당합니다. 데이터의 상태를 유지하고, 변경에 따라 뷰와 컨트롤러에 통지합니다. 2. View (뷰):** 사용자 인터페이스와 관련이 있습니다. 모델의 데이터를 표시하고 사용자의 입력을 받아 컨트롤러에 전달합니다. 3. Controller (컨트롤러):** 사용자의 입력을 받아 모델과 뷰를 업데이트합니다. 모델의 상태를 변경하고, 이 변경을 뷰에 알리는 역할을 합니다. 이렇게 구성된 MVC 패턴은 소프트웨어의 유지보수성과 확장성을 높일 수 있습니다. - @Controller` 및 `@GetMapping`: 이것들은 스프링 프레임워크에서 사용되는 어노테이션입니다. 1. @Controller`: 해당 클래스가 컨트롤러임을 나타냅니다. 스프링은 이 클래스를 검색하여 웹 애플리케이션의 컨트롤러로 등록합니다. 2. @GetMapping`: HTTP GET 요청을 처리하는 메소드임을 나타냅니다. 예를 들어, `@GetMapping("/hello")`은 "/hello" 경로로의 GET 요청을 처리하는 메소드를 정의합니다. |
- Mustache(사용시 plugin 설치 필요): Mustache는 템플릿 엔진 중 하나로, 주로 웹 애플리케이션에서 동적으로 HTML을 생성할 때 사용됩니다. Mustache는 간단하면서도 가독성이 높은 문법을 제공하며, 여러 언어에서 사용할 수 있는 특징이 있습니다. 스프링 부트에서는 Mustache를 뷰 템플릿으로 사용할 수 있습니다. - 절대경로 vs 상대경로: 1. 절대경로: 파일이나 디렉토리의 경로를 루트 디렉토리부터 전체 경로로 지정하는 방식입니다. 예를 들어, 웹 애플리케이션에서 웹 루트 디렉토리부터의 경로를 나타낼 때 사용됩니다. 2. 상대경로: 현재 작업 디렉토리를 기준으로 경로를 지정하는 방식입니다. 상대경로는 현재 위치에 따라 경로가 동적으로 변경될 수 있습니다. 이는 주로 파일이나 디렉토리 간의 상대적인 위치를 나타낼 때 사용됩니다. |
- mustache에서는 layouts를 설정
{{>layouts/header}}
<!--content-->
<div class="bg-dark text-white p-5">
<h1>{{username}}님, 반갑습니다!</h1>
</div>
{{>layouts/footer}}
=> 만약 Mustache 템플릿 엔진을 사용하여 웹 페이지의 레이아웃을 설정하고 싶다면, header와 footer를 각각의 Mustache 파일로 만들어서 레이아웃을 구성할 수 있습니다.