이전에 Spring Boot 기반의 프로젝트에서 Thymeleaf와 함께 Tailwind CSS를 사용하는 방법에 대해 소개하였었다. 2023.11.16 - [Study/Java] - Spring Boot + Thymeleaf + Tailwind CSS 사용해보기 DaisyUI 소개 Tailwind CSS가 bootstrap보다 자유도가 높은 대신 많은 설정이 필요하기 때문에 이를 보완하기 위해 Daisy UI를 사용하였다. DaisyUI는 Tailwind CSS기반에서 Bootstrap의 component 단위(Button, Form, Menu 같은...)의 CSS를 제공해 준다. 따라서 Component 단위로는 Tailwind CSS를 사용하면서 그 외의 CSS 설정은 Tailwind CSS를 같이..

Spring은 HTML 페이지를 렌더링 하기 위해 Thymeleaf, FreeMarker, Mustache, Groovy 와 같은 Template Engine 을 지원한다. https://docs.spring.io/spring-boot/docs/current/reference/html/web.html#web.servlet.spring-mvc.template-engines 보통 Thymeleaf 를 많이 쓰지만 다른 것과 같이 사용하고 싶은 경우가 있을 수 있다. Spring은 이를 위해 요청에 따라 Template Engine을 분기하여 처리하는 ContentNegotiatingViewResolver 를 제공한다. 설정 사용하려는 template engine 관련 지원 dependency를 다음과 같이 ..

Nuxt (Vue) 나 SvelteKit (Svelte) 같은 FE 개발 framework를 공부하는 것도 좋긴 한데 너무 빠르게 변화하다 보니 학습에 대한 부담이 크다고 느껴졌다. Spring Boot + Thymeleaf에서 Bootstrap을 사용해본적이 있었다. 그래서 Spring Boot + Thymeleaf 에서 Tailwind CSS를 사용해보고 싶어졌다. Tailwind CSS 소개 https://tailwindcss.com/ Tailwind CSS는 plex , pt-4 , text-center , rotate-90 과 같은 class로 구성된 utility-first CSS framework로, markup에서 바로 어떤 디자인이든 만들 수 있다. html에 style을 설정하는 부분을..

thymeleaf도 하도 오래간만에 보니 새로 배우는 느낌이어서 정리하면서 써보려고 한다. FE, BE가 완전히 분리되지 않는다는 게 단점이지만 반대로 보면 Thymeleaf가 BE와 연동이 매우 쉽다는 것이 장점이기도 하다. Spring Boot에서 Thymeleaf 사용하기 기본 사용 Spring Boot에서 Thymeleaf를 사용하려면 다음 dependency를 추가하면 된다. org.springframework.boot spring-boot-starter-thymeleaf 이 dependency를 추가하면 Spring Boot AutoConfigure는 Thymeleaf를 사용할 수 있는 기본적인 설정을 제공해 준다. 현재 spring-boot-starter-thymeleaf는 thymeleaf..