개인공부-7

박상훈·2023년 5월 13일
0

개인공부

목록 보기
7/16

1. 다시 보는 Spring MVC2편 공부

Thymleaf

  • 뷰 템플릿
    1) 요즘 개발은 리액트 같은 기술로 화려한 프론트를 구성한다.( 나의 마지막 프로젝트로 그러했다 )
    2) 간단한 동적 페이지나, 어드민 페이지( 화려한 프론트가 필요하지 않은경우 ) 빠르게 만들 수 있다.
    3) JSP, Thymleaf 같은 동적 페이지 만드는 기술 중 하나라도 알고있자..
<!DOCTYPE html>
<html xmlns:th="http://www.thymleaf.org">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
    <h1>컨텐츠의 데이터 출력하기</h1>
<ul>

    <li>th:text 사용<span th:text="${data}"></span></li>
    <li>컨텐츠 안에서 직접 출력하기 = [[${data}]]</li>
</ul>
</body>
</html>
  • Controller에서 data에 담은 text를 출력할 수 있게 함.

Escape? Html Entity?

  • "data"로 내려준 정보에 <><>와 같은 html 테그로 인식되는 속성이 있는 경우, html테크로 인식 되지 않게
    escape처리를 해준다.
  • 그냥 정말 내려준 정보에 테크를 같이 사용하고 싶다면, unescape를 해줘야한다.
<!DOCTYPE html>
<html xmlns:th="http://www.thymleaf.org">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>


    <h1>text vs utext</h1>

    <ul>

      <li>th:text = <span th:text="${data}"></span></li>
      <li>th:text = <span th:utext="${data}"></span></li>
    </ul>

  <h1><span th:inline="none">[[...]] vs [(...)]</span></h1>

  <ul>

    <li><span th:inline="none">[[...]] = </span>[[${data}]]</li>
    <li><span th:inline="none">[(...)] = </span>[(${data})]</li>
  </ul>
</body>
</html>
profile
기록하는 습관

0개의 댓글