Modern frontends with Thymeleaf and htmx by Wim Deblauwe
HTML-код
- Опубликовано: 12 окт 2022
- Frontend development is getting more and more complex when using JavaScript frameworks like Angular or React. On top of that, the landscape is also rapidly changing. Developers claim that this is needed to build the highly interactive web experiences we all come to know and like. However, that is not true. This talk will show how you can use the productive combination of Java 17, Spring Boot, Thymeleaf, and the htmx JavaScript library to build such experiences without writing JavaScript. Adding a few attributes to your HTML will allow you to implement patterns like Click To Edit, Endless Scrolling, Lazy Loading, etc…
You might think that you need to start your new project with a JavaScript framework because you “might need that interactivity” later. This talk will show that you can use htmx to enhance your web application easily where it makes sense. For the rest of your application, use the simplicity and productivity of server-side rendering.
htmx is already making great strides in the PHP/Laravel and Python/Django world, it is time for the Java/Spring Boot world to embrace this as well.
Wim Deblauwe
Wim Deblauwe is a freelance Java developer with over twenty years of Java experience. He is the author of Taming Thymeleaf and has implemented many Thymeleaf projects, for companies ranging from startups to established companies.
------------------------------------------------------------
INTRO
* visuals & editing by @Mercator
* music : Avocado by Ephixa - Наука
Velocity and maintainability is back, great job
How many thinghs must be reverted back. That is the question
Vet nice talk. Some new java code:
var $ = ST;
var name = "me";
var string = $."Hello \{name}";
Yes, string templating in native Java. No library needed !!!
HTMX, it is really nice, have used it in my project
Returns new :)
I have never liked all the complexity added by JS Frameworks for frontends... Sure there are cases where this really adds value. But often this adds no real value and makes your tech stack overly complicated. I also have my issues with JS as a language. Of course this is personal preference, but at a higher level: We need to produce value for the customer, the company, for us... not being caught in a web of doing fancy stuff just to do fancy stuff. Many times i see the frontend stuff and think: Man i just want to render a page that shows XYZ, we dont need quantum physics for that.
Well, JS was made to add interactivity to a page. HTMX seems to be the pinnacle of that idea. Next we need to add a similar standard to html speck and we won't even need JS. WASM is a better solution for client side render anyways with likes of React Nativ, Flutter, GTK and QT writen in proper languages
it is really nice.. i wanted to know about thymeleag
wow this is a veeery good presentation.....only the proper content, no unnecessary bs.
Nice presentation! I will look into using this as opposed to using a separate front-end framework for my next (hobby) project.
I have been playing around with the ttcli to bootstrap a project but the live reload is not working with IntelliJ Community Edition..
learn lot, thx!
Hi, interesting topic, I have question about UI state - how you handle it ? It must be stored on the backend right ? Where you store it exactly ? How does it impact backend performance ?
HTML can be your state 🙂 If you have log in button on your page this means you are not logged in. If you have delete button in data table this means you have permissions to do it. Just don't show delete button for people without permissions. Simple problems like these above can be handled this way.
Cookies, you got to love haiting them. They manage client side state. Ideally you want your server to be stateless
it looks to me like JSF + RichFaces from the old days... at the end you just send AJAX and receive fragments that you replace.
However it is basically jQUEYR (jquery template) the downside is there is no client side optimisations as I see..