Posts

Showing posts with the label Todo

Spring Boot htmx Thymeleaf - CRUD Todo App

Image
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

Spring Boot, Vue.js, and PrimeVue - Building a CRUD Todo App

Image
In this section, we will build a Todo CRUD app with Spring Boot, Vue.js, PrimeVue, and PostgreSQL. Technologies Used Java 17 Spring Boot 3.3.0 Spring Data JPA Lombok PostgreSQL Vue 3 PrimeVue After completing this tutorial what we will build? We will build a full-stack web application that is a basic Todo Management Application with CRUD features:  Create Todo  List Todo  Update Todo  Delete  Todo  1. Backend development 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  todo-service . Here I selected the Maven project - language  Java 17  -  Spring Boot 3.3.0 ,   Spring Web,  PostgreSQL Driver, Spring Data JPA,   and  Lombok . Then, click on the Generate button. When we click on the Generate button, it starts packing the project in a .zip( todo-service ) file and downloads the project. Then, Extract the Zip file.  Then, import the project on your favourite IDE.  Final Projec