Using Bootify for a Spring Boot Prototype with Thymeleaf
Bootify is an application generator for Spring Boot prototypes. How can we use this tool to build a Spring Boot CRUD app with Postgres as a database and Thymeleaf as a frontend?
Although Thymeleaf almost has an epical age and nowadays many web applications are built as SPA, the library still serves its purpose extremely well. To make the user experience a little smoother, we also want to use HTMX with the boost function. We will create a simple database schema to manage books, authors and readers. Huge thanks to Piotr for the very kind opportunity to briefly introduce Bootify here.
You can find several other articles on this blog about Spring Boot. For example, to learn how to build microservices with Spring Boot 3 and Spring Cloud read the following article.
Configuration of our application
For our new project, we go to Bootify.io and click on the “Start project” link. Our new project can now be accessed via its unique URL. There we can first define the general properties for our small demo.
We have selected Gradle as the build tool and Java together with Lombok as the language. Thymeleaf with Bootstrap is active as the frontend stack – with this option, Bootstrap and HTMX are integrated as WebJars. Alternatively, a Webpack setup, Tailwind CSS, or Angular are also available for the frontend. Bootify adds the necessary dependencies for our selected database and also takes into account special requirements of the JPA classes, e.g. for JSON or UUID types.
Further down in the developer preferences, we also activate the option for Docker compose – this will include the spring-boot-docker-compose
library and prepare the docker-compose.yml
so that a Docker container with Postgres is automatically used when our application is started locally. This significantly shortens the preparation time for every new developer and helps with maintenance in the long term.
We can now create our database schema in the Entity tab. For each of the three entities, we activate the CRUD option for the frontend so that the corresponding functionality is directly available.
There is an M:N
relation between a book and a reader, so we create a many-to-many relation here. For a real application, we might create a dedicated entity, which makes customizations and extensions easier later on.
Code Review and Start
When we are happy with the code in the preview, we download the application and create a new project for it in IntelliJ. It will look something like this.
By right-clicking on the BookManagerApplication
class, we can create our own run configuration. There we enabled the VM option below Modify options
so that we can store an additional parameter. With -Dspring.profiles.active=local
we start our application with the local
profile. The Lombok plugin is automatically recommended by IntelliJ and must be activated. Another interesting option is hidden in the settings under Build, Execution, Deployment > Build Tools > Gradle
– there we can switch from Gradle to IntelliJ for the execution of our application, which gives us better insight into the logs.
To start the application, Docker should be available on the system so that the container for Postgres can be started. The spring.docker.compose.lifecycle-management=start-only
property in our application.yml
keeps the container running even after the application is stopped – it can be shut down manually if necessary.
The local
profile activates the LocalDevConfig
class and ensures that changes to the Thymeleaf templates are immediately available in the browser. The forms are generated via the inputRow
fragment to avoid repetitive code. The hx-boost
flag on the body
element makes HTMX perform every action in the browser via Ajax.
Conclusion
With the available options in Bootify, each Spring Boot prototype can be configured so that it really only contains the code we want to have. At the same time, you can start a new project with a modern tech stack and many helpful features. I hope this article has given you a good introduction and that Bootify can help you with your future projects!
4 COMMENTS