HTML in your HTML

Posted in: Programming

First, some programmery updates to get out of the way:

Thymeleaf Extras Eclipse Plugin

I've completed the first stable release of my first ever Eclipse plugin, which happens to be a content assist plugin for Thymeleaf. It started out as just another spare time side-project, then eventually got folded into the Thymeleaf project itself as an 'extras' module. The plugin adds content assist features to the HTML editor, listing element processors and attribute processors alongside HTML element/attribute suggestions.

Thymeleaf extension (aka: dialect) authors can also take advantage of the plugin to have their dialects show up in the HTML editor. You can find download links and more details on the project's GitHub page:

Thymeleaf Layout Dialect

I've also gone and updated my own Layout dialect for Thymeleaf to show up in said Eclipse plugin. The updated download or Maven co-ordinates can be found on that project's page:

I mention the name 'Thymeleaf' a bunch up there. It's one of the parts used in the construction of this website, and last month I joined the developer line-up for the Thymeleaf project, so you might see me write a bit more about it in the future.

If you're a programmer and didn't follow any of the links on this blog post before this current sentence, then the short of Thymeleaf is that it's a Java library for writing HTML templates. For me however, what it really is is the first ever view framework I've come across that doesn't feel like it insults web designers.

Thymeleaf logo
Thymeleaf: we actually like web designers

The whole 'not insulting web designers' thing is why I made the switch to Thymeleaf last year with the website redesign; I was done with JSPs to make HTML (the code you're writing barely looks like HTML any more, and it requires throwing too much Java code into them to make them do what you want), and I wasn't touching JSF with a 40-foot pole (not after my last work project in which I had to use it and stare in horror as it generated HTML code like it was 1999).

After some looking around I settled on Thymeleaf because, aside from the numerous benefits advertised on it's website, the one that stuck out to me was that the code you wrote to generate HTML actually looked like, and used, HTML.

I think for any code generators, that's my number one requirement: that the code being generated is written in and resembles the language of the code being generated. It makes the learning curve very mild because if you know the language of the code you want to generate, then everything else you need to learn already looks and feels like familiar territory.

It also makes it very inclusive: people who know HTML (like web designers) don't feel like they need to learn another programming language just so they can do their job (designing, which involves messing with HTML files).

Another framework which follows this principle, and that I also picked for the site redesign, is LESS, a CSS generator which looks like, and uses, CSS.

I've become quite fond of both Thymeleaf and LESS, so much so that I use both quite a lot in my 9-to-5 paid job for when I need to whip-up a website or mobile app prototype in under an hour to showcase some feature that my team is looking into developing.

The best part is when I get to show the others how I did things, because then I point them to the Thymeleaf or LESS files and they can understand those files right away, even if they didn't know Thymeleaf/LESS, because what they're looking at is HTML/CSS.