[스프링부트- blogV1] 6. 머스태치로 글 목록 보기 그림그리기

Dec 30, 2024

Contents

1. Mustache 플러그인 설치 2. UTF-8 설정하기 3. resources폴더의 templates폴더(외부접근 불가)에 .mustache 파일 생성 4. mustache문법을 적용하여 그린다! 시작은 html 단축키

1. Mustache 플러그인 설치

2. UTF-8 설정하기

UTF-8설정을 하지 않으면 글이 깨지므로 application.properties에 들어가서 설정 필수!

3. resources폴더의 templates폴더(외부접근 불가)에 .mustache 파일 생성

static에는 정적파일(HTML, CSS, JavaScript,image파일…)을 넣고,

templates에는 동적파일( Mustache, Thymeleaf….)을 넣는다.

4. mustache문법을 적용하여 그린다! 시작은 html 단축키


<!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>
        {{#models}}
        <tr>
            <td>{{id}}</td>
            <td>{{title}}</td>
            <td><a href="/board/{{id}}">상세보기</a></td>
        </tr>
        {{/models}}
    </table>
</section>

</body>
</html>

Controller


  @GetMapping("/")
  public String list(){
    return "list";
  }

return “list”만해도 list.mustache를 불러오는 이유

Spring에서는 contoller실행 시 뷰 리졸버가 실행되어 프리픽스(prefix)와 서픽스(suffix)를 지정한다.

(RestController 실행 시에는 뷰 리졸버가 실행되지 않는다.) 프리픽스: 템플릿 파일이 위치하는 경로 (예: classpath:/templates/) 서픽스: 템플릿 파일의 확장자 (예: .mustache)

See more posts

[스프링부트- blogV1] 6. 머스태치로 글 목록 보기 그림그리기

1. Mustache 플러그인 설치

2. UTF-8 설정하기

3. resources폴더의 templates폴더(외부접근 불가)에 .mustache 파일 생성

4. mustache문법을 적용하여 그린다! 시작은 html 단축키

Controller

More articles

[스프링부트- blogV1] 8. 톰캣의 메모리 저장과 통신

[스프링부트- blogV1] 7. 글 목록 보기 쿼리와 테스트

[스프링부트- blogV1] 5. 더미데이터 생성하기

[스프링부트- blogV1] 4. 롬복으로 의존성 주입하기