1. 파일 생성 및 작성
resources폴더에는static폴더와templates폴더가 존재static폴더 : 정적인 자원(파일)들을 저장하는 용도templates: 동적인 자원(파일)들을 저장하는 용도
- templates 폴더 안에 있는 파일들은 기본적으로 숨김처리가 되어 외부에서 접근 블가
- 주로
Thymeleaf,Mustache,Freemarker등의 템플릿 엔진을 통해 서버 사이드에서 HTML을 렌더링하는데 사용 - 보안: 템플릿 파일을 외부에서 직접 접근하지 못하도록 함으로써 보안을 강화
- 서버 사이드 렌더링: 템플릿 엔진은 서버에서 데이터를 이용해 HTML을 렌더링하고, 완성된 HTML을 클라이언트에게 전송. 이 과정에서 템플릿 파일은 서버에서만 접근 가능
templates 폴더 안에 list.mustache 파일을 생성 및 작성list.mustache 파일 내용:
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>blog</title>
</head>
<body>
<nav>
<ul>
<li>
<a href="#">홈</a>
</li>
<li>
<a href="#">글쓰기</a>
</li>
</ul>
</nav>
<hr>
<section>
<table border="1">
<tr>
<th>번호</th>
<th>제목</th>
<th></th>
</tr>
<tr>
<td>5</td>
<td>제목5</td>
<td><a href="#">상세보기</a></td>
</tr>
<tr>
<td>4</td>
<td>제목4</td>
<td><a href="#">상세보기</a></td>
</tr>
</table>
</section>
</body>
</html>list.mustache 파일을 실행시키기 위해 컨트롤러 클래스의 내용을 추가적으로 작성.BoardController 작성 내용 :
@RequiredArgsConstructor// final이 붙어있는 변수의 생성자를 만들어준다
@Controller
public class BoardController {
private final BoardService boardService;
// 컨트롤러는 view resolver 클래스를 가지고 있고, return 문자열과 동일한 파일을 찾아서 실행한다.
@GetMapping("/")
public String list() {
return "list";
}
}
- 간단하게 경로를 / 하나로 작성하였으며, 해당 요청을 받으면 list 파일의 내용을 보여줄 수 있도록 구성
return할 문자열 값을 보여줄 파일의 이름 (확장자 제외) 만 작성하면, 해당하는 이름의 뷰 내용을 브라우저에서 출력
컨트롤러는 클라이언트의 요청을 처리하고,
ViewResolver를 통해 논리적 뷰 이름을 실제 뷰 파일로 매핑하여 최종적으로 클라이언트에게 응답을 제공2. 출력 결과
properties파일에서 인코딩 설정을 하지 않아 한글이 모두 깨진 상태로 출력되는 모습
- 해당 문제를 해결하기 위해
properties파일에 추가 내용을 작성
properties 파일 추가 내용:
encoding 설정을 utf-8 로 변경3. properties 파일 수정 후 출력 결과
list.mustache 파일 내용이 한글 깨짐 없이 정상적으로 출력Share article