Karzin Lab

Project.다원 Ensemble_기능검토(3)_Thymeleaf Layout Dialect

간만에 개발을 진행하면서 아쉬운 부분이 있어 검색을 통해 추가한 Thymeleaf Layout Dialect에 대해서 설명을 해볼까 합니다.

사실 이전에 Template Engine 자체를 Thymeleaf를 사용하겠다고 개발정보에 떡하니 작성은 했으나, Thymeleaf Layout Dialect에서의 조금 다른 layout기능이 필요하여 dependency에 추가를 해주었습니다.

오늘은 이 기능을 살짝 맛보기 수준으로 설명을 하고 계속해서 개발을 진행하면서 괜찮은 정보가 있다면 공유를 하도록 하겠습니다.

기능 검토 - Issue

우선 사건의 발단(?)은 이랬습니다.

위의 이미지를 보시는것처럼 저는 Common적인 요소를 어떻게하면 더 편리하게(?) 활용을 할 수 있을까?

재활용이 용이할까? 라는 생각으로 시작을 하게 되었습니다.

사실 이러한 기능은 Thymeleaf에서도 지원을 안하는건 아닙니다.

다만, 조금 더 소스의 길이가 길어질 뿐 (그리고 그만큼 개발자인 저도 귀찮아질 뿐...) 사용에는 큰 지장은 없었습니다.

그럼에도 불구하고 저는 더 나은 방법을 찾고 싶었고, 그에 대한 해답으로 제시한 것이 Thymeleaf Layout Dialect 였습니다.

우선 기존에는 어떤 느낌이었는지를 그림으로 보여드리겠습니다.

기존에 사용하던 방식을 나타낸 그림

위와 같이 기존에 사용하던 방식은 top과 left의 메뉴를 일일이 화면에 replace를 해주어야 했습니다.

사실 하나씩 replace를 해주면 금방끝나는거겠지만, 화면이 계속해서 늘어남에 따라 replace해주어야하는 양도 그만큼 늘어날 것이고, 화면이 더 늘어나기 전에 해결을 해둠으로써 저의 잠자는 시간을 지키기위해 좀 더 편리함을 추구 하기 위해 검색을 해보았습니다.

변경된 방식을 나타낸 그림

검색의 결과, 저는 위 그림처럼 contents를 기존의 layout의 특정영역(즉 기존 layout의 contents영역)에 바꿔치기를 해주는 방식을 찾아냈습니다.

이게 바로 Thymeleaf Layout Dialect이었고, 간편하게 dependency만 추가해주면 정말 편리하게 사용할 수 있었습니다.

(사실 dependency추가 안해놓고 왜 안되냐고 삽질하면서 20분 날려먹은건 비밀입니다..)

장단점

이 방식의 최대의 장점은 기존의 layout의 틀만 잡아놓고, 변경을 해둘 contents의 부분만 잘 잡아놔주면, 개발자는 해당 contents만 작업을 해주면, 미리 layout에 잡아놓은 common적인 요소들은 그냥 기본적으로 딸려온다는 점이죠.

그만큼 소스작업에 있어서도 굉장한 편리성이 느껴집니다.

대신 단점은 contents만이 아니라 common요소에 대한 커스텀이 필요할 때에는 common요소에 대해서 단일화면에서만 사용하기 위한 용도로는 수정이 불가하다는 점이 있습니다.

이럴때에는 기존에 사용하던 Thymeleaf의 replace나 include기능을 사용해 커스텀을 이용해주면 되겠지만 말이죠.

Thymeleaf Layout Dialect의 License

mvnrepository를 이용하면 License의 정보를 쉽게 파악할 수 있는데요,

Thymeleaf Layout Dialet의 License는 Thymeleaf와 동일한 Apache 2.0입니다.

큰 문제없이 사용이 가능할것으로 보여 License만 체크 후 바로 dependency에 추가했습니다 ㅋㅋㅋ

으헉.. 벌써 2시 7분이네요!

내일을 위해서 얼른 자야겠네요ㅠㅠ

공부는 즐거운데 시간은 항상 왜 이렇게 빨리지나가는지 아쉽기만합니다 ㅠㅠㅠ

버전정보 (v1.0)

 - v1.0 2020.07.29 배포

* 본 게시글의 이미지에 들어간 글씨체는 네이버 나눔 글씨체인 나눔스퀘어 Bold를 사용했습니다.

* 본 게시글의 이미지는 전부 (이미지 내의 픽토그램 등) 직접 제작했음을 명시합니다.

* 저작권에 위반될 수 있는 컨텐츠(이미지, 동영상 등)나 게시글은 삭제되거나 수정될 수 있습니다.

* 문제의 여지가 될 수 있는 컨텐츠의 경우 댓글 달아 주시면 빠른 시일 내에 조치하도록 하겠습니다.

* Karzin은 항상 공부중입니다. 설명이 틀리거나 잘못된 부분이 있다면 의견내주시는대로 수정하도록 하겠습니다.

Project.다원은 개인(karzin)이 기획, 분석, 설계, 디자인, 개발, 유지보수 등

모든 부분을 혼자 맡아 진행하는 개인 프로젝트입니다.

Project.다원 Ensemble

Karzin

abbeea@naver.com