https://github.com/josh-mchugh/simple-backend-rendered-forms

Simple example of using thymeleaf layouts and jQuery to create simple render forms with validation and history state
https://github.com/josh-mchugh/simple-backend-rendered-forms

java jquery spring-boot thymeleaf

Last synced: 8 days ago
JSON representation

Simple example of using thymeleaf layouts and jQuery to create simple render forms with validation and history state

• Host: GitHub
• URL: https://github.com/josh-mchugh/simple-backend-rendered-forms
• Owner: josh-mchugh
• Created: 2020-04-24T02:28:31.000Z (over 4 years ago)
• Default Branch: master
• Last Pushed: 2023-01-07T17:27:01.000Z (almost 2 years ago)
• Last Synced: 2024-04-24T11:55:49.897Z (7 months ago)
• Topics: java, jquery, spring-boot, thymeleaf
• Language: HTML
• Homepage:
• Size: 3.11 MB
• Stars: 0
• Watchers: 1
• Forks: 0
• Open Issues: 18
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
### Simple Thymeleaf Backend Rendering Application

This is a simple self contained Spring Boot app to demonstrate backend rendering and validation with Thymeleaf. 

Backend rendering can make input field validation easy with the use of ajax as you can submit forms and re-render the form 

after it has been validated on the backend. Pageable tables can also be handled simply with backend rendering as it's just HTML and CSS

and no need for a lot of extensive javascript or javascript libraries which are hard to customize.

The use of jQuery's delegation and backend render of partial HTML reduces the complexity and increases the speed of application development as the view is just simple HTML and CSS. 

The business logic for validation is contained to the backend and does not spill over to the frontend.

Thymeleaf Extensions:

  - Layout templates: https://github.com/ultraq/thymeleaf-layout-dialect

  - Pagination: https://github.com/jpenren/thymeleaf-spring-data-dialect

Front End Components:

- gulp

- webpack

- bootstrap

- fontawesome

## Running the App

````

mvn spring-boot:run

````

## Building Frontend

````

cd frontend

gulp build

````

or

````

cd frontend

npm run build

````

## Building the App

````

mvn clean install

````

## Demostration

![alt text](./demo.gif)