Knowledge Factory

In this section, we will create a Todo CRUD app with Spring Boot , htmx , Thymeleaf ,  Bootstrap , and PostgreSQL . About htmx HTMX can be used for the API/server-side calls directly in the HTML. More Info:  click here We can use HTMX to create interactive templates in our Spring Boot application. We can dynamically call and fetch data from the server by using simple HTML attributes like hx-get, hx-put, etc. We'll cover those in this article. We will be exploring the basis of HTMX by creating a basic CRUD application. Technologies Used Java 17 Spring Boot 3.3.0 Spring Data JPA PostgreSQL Thymeleaf  htmx Bootstrap Creating a spring boot application First, open the Spring initializr  https://start.spring.io Then, Provide the Group and Artifact name. We have provided Group name  com.knf.dev.demo  and Artifact  spring-boot-htmx-crud . Here I selected the Maven project - language  Java 17  -  Spring Boot 3.3.0 ,   Spring Web, Spring Data JPA , Lombok , PostgreSQL Driver , and  Thymeleaf

In this section, we will build a simple 'hello world' web application with Spring Boot , htmx , and,  Thymeleaf . Technologies Used Java 17 Spring Boot 3.3.0 Thymeleaf  htmx Bootstrap   About htmx HTMX is a small JavaScript library that allows us to use custom attributes within the HTML code that execute an Ajax request and integrate the result into the DOM. This makes it ideal for server-side rendering with Thymeleaf and Spring Boot. htmx enables the development of web applications that have the feel of SPA (Single-page application).  With the ease and power of hypertext, htmx allows you to create modern user interfaces by enabling you to leverage not just AJAX but also CSS Transitions, WebSockets, and Server Sent Events directly in HTML through the usage of attributes. More Info:  https://spring.io/blog/2024/03/15/hypermedia-and-browser-enhancement#htmx The simplest way to do that would be to grab it from a CDN: < script src = 'https://unpkg.com/htmx.org/dist/htmx.min