[그린컴퓨터] Server/Spring

MVC 구조와 Thymeleaf 3. Thymeleaf { 개요, 동작과정, 컨트롤러, 예제 }

Ben의 프로그램 2023. 8. 2. 09:22
728x90
Thymeleaf 란?
타임리프는 JSP의 대안으로 만들어졌는데요. 자바 기반의 템플릿 엔진입니다. 템플릿 엔진이란 
타임 리프는 자바 코드를 삽입하여 컨트롤러에서 전달한 데이터를 처리하는 역할을 수행합니다. 이때 조건문, 반복문, 객체 등을 활용해서 다양한 기능을 사용할 수 있습니다. 

 

Thymeleaf 동작과정
이전과 크게 달라지지는 않는데요. 컨트롤러가 model 을 전달하면 그것을 이용해서 화면을 출력하는 것이 Thymeleaf 입니다.

 

Thymeleaf 예제
ex2( ) 메서드를 새로 만들었는데요. 여기서 사용된 Model 은 파라미터가 아니라 화면단에 값을 전달하는 역할을 수행하는 객체입니다. model 을 사용해서 addAttribute( ) 메서드를 사용할 수 있습니다. 이 메서드는 변수의 이름과 진짜로 보내고 싶은 데이터를 인자로 담아서 실행합니다. 위에서는 msg 라는 변수에 "안녕하세요" 라는 값을 담아서 View 단에 전달합니다. View 는 받은 정보를 렌더링하여 화면을 출력하게 되는 것이죠.

이번에는 실제 ex2.html 파일입니다. th:text 라는 속성을 사용하는 것을 볼 수 있는데요. 화면이 렌더링 될 때 태그와 태그 사이의 컨텐츠로 출력이 되는 속성입니다. th:text 속성의 값으로 변수 표현식(${ })을 사용하여 컨트롤러에서 전달한 변수의 이름인 "msg"를 사용하였습니다. 이렇게 하면 실제로 렌더링 될 때 변수에 들어있는 값이 출력됩니다. 

실제로 접속을 해보니까 위와 같이 출력이 되어 있는 것을 확인할 수 있는데요. th:text="${msg}" 속성이 정상적으로 동작하여 h1 태그의 콘텐츠가 "안녕하세요"로 설정되어 출력이 된 것을 확인할 수 있습니다. 

 

Thymeleaf 연습문제 1.
컨트롤러를 우선 만들고 html 파일을 만들어보겠습니다. 

컨트롤러를 우선 만들었는데요. 모델에 3가지 값을 넣어주었습니다.

q2.html 파일에는 2가지 방법으로 thymeleaf 를 사용할 수 있는데요. 위와 같이 th:text= "${ }" 속성을 활용 하거나 속성을 벗어나면 [[${ }]] 를 활용하여 thymeleaf 를 사용하여 컨텐츠로 표기하였습니다.

실제로 출력되는 값을 확인해보니 잘 출력되고 있는 것을 확인할 수 있습니다. 이렇게 thymeleaf 로 화면의 콘텐츠를 채우는 방식은 HTML 코드를 변경하지 않고 화면의 컨텐츠를 동적으로 수정할 수 있는 장점을 가지게 됩니다.