세미나 네번째 주제
🔥 Thymeleaf 🔥
📌 Thymeleaf?
HTML, XML, Javascript,css 및 일반 텍스트까지 처리할 수 있는 웹 및 독립실행형 환경을 위한 최신서버
➕ jsp, freemarkerd와 같이 서버에서 클라이언트에게 응답할
브라우저 화면을 만들어주는 역할을 함📌 목표
타임리프의 주된 목표는 유지관리가 쉬운 템플릿 생성 방법을 제공하는 것입니다.
그래서 실제로 템플릿에 영향을 주지 않는 방식을 사용하고 있습니다.
템플릿에 영향을 주지 않는 다는 것은 html의 구조를 깨지 않는 즉, 기존의 html코드를 변경하지 않고 덧붙이는 코드 방식을 말합니다.
이러한 타임리프는 natural template과 서버사이드 렌더링 기반이며 스프링에서 권장하고 지원하는 특징을 가지고 있습니다.
📌 특징
✅ Natural Template
순수 html을 유지하면서 view template도 사용할 수 있는 타임리프의 특징을 natural template이라고 합니다. 타임리프는 순수 html을 최대한 유지하기 때문에 웹브라우저에서 파일을 직접 열어도 html내용을 확인 할 수 있습니다.
하지만 서버를 거치지 않으므로 동적으로 결과가 렌더링 되지는 않습니다.
✅ 서버사이드 렌더링
타임리프는 백엔드 서버에서 html을 동적으로 렌더링하는 용도로 사용됩니다. 여기서 렌더링이란 html,css,javascript등의 코드를 사용자가 볼 수 있도록 변환해주는 과정을 말합니다.
타임리프는 서버사이드 렌더링 방식으로 렌더링되는데 이는 서버에서 렌더링 작업을 완료하고 결과물을 화면에 전달하는 방식으로 검색엔진 최적화와 빠른 페이지 렌더링을 위해 사용합니다.
✅ 스프링에서 권장하고 통합지원
스프링에서는 타임리프를 자연스럽게 통합하고 스프링의 다양한 기능을 사용할 수 있도록 지원하고 있습니다. 스프링부트와 함께 사용하는 것을 권장하고 있고 간단한 의존성 추가작업만으로도 스프링부트에서 타임리프를 사용할 수 있습니다.
📌 장점
- natural template : 서버상에서 동작하지 않아도 되기 때문에 서버 동작없이 화면을 확인 할 수 있음
- html에는 마크업만 존재하기 때문에 시각적으로 편함
- 퍼블리셔가 작성한 코드를 직접 건드리는 것이 아니라 덮어쓰는 방식이기때문에 디자인팀과 개발팀간의 협업이 편해짐
- Servelt으로 변환되지 않기 때문에 비즈니스 로직과 분리되어 오로지 View에 집중할 수 있음
- 페이지를 생성하는데 필요한 정보를 태그의 속성으로 넣고 remove 속성을 이용해서 실제 생성될 페이지에서는 제거될 태그를 넣을 수 있어서 페이지의 프로토타입을 제공할 수 있음
📑 References
https://jaimemin.tistory.com/1835
https://velog.io/@alicesykim95/Thymeleaf#-thtext
https://sjparkk-dev1og.tistory.com/30
https://pugyu.tistory.com/75
