Skip to main content

Command Palette

Search for a command to run...

Simplifying the Front End: A Fresh Look at an Old Method

Updated
2 min read
Simplifying the Front End: A Fresh Look at an Old Method
S

Experienced software developer from Monroe, Mi with team lead experience, who has written production code in both Angular and React on the front end and NodeJS, Python, and Perl on the backend. I have also worked on Mobile apps using React Native.

In my previous job, we began discussing the concept of transitioning to a more streamlined front-end system. This would involve utilizing a technology like HTMX, which sends HTML over the wire, rather than relying on a separate front-end server to make API calls and render the front-end. Although the idea wasn't mine, I wholeheartedly agreed with it, as it resonated with my passion for efficiency

As a front-end software engineer for a large part of my career, I enjoy working on the front-end with frameworks like React, but I also recognize the inefficiencies that arise from having to build things twice. Back in 2017, I created my own version of "HTMX" using jQuery for a personal project. The approach involved serving up HTML and replacing divs, which proved to be an enjoyable and efficient way to build an app.

Recently, I've been exploring Laravel, which offers Livewire, while Ruby on Rails has Hotwire. I'm thrilled to see that this paradigm not only exists but seems to be gaining popularity. However, I'm not suggesting that everyone should abandon their React front-end and migrate everything to the server. Instead, I believe that when new projects emerge, this alternative approach should be considered.

I'm eager to delve deeper into HTMX, Livewire, and Hotwire, and to identify their limitations. From my initial examination, I believe these technologies can address 90% of a web app's requirements. By offering another option for front-end development, we can potentially streamline the process and create more efficient, enjoyable experiences for both developers and users alike.

I am curious how others feel about this. If you had a greenfield project would you opt for HMTL over the wire or separate frontend and backend builds?

F

Hi Shane Burgess, so I've been hearing good things about HTMX, but I haven't dived into the docs to learn more about it, which I should probably do soon.

As an experienced Engineer, that had to build your own solution like HTMX, what advantages would you say using HTMX brings to the table?

Maybe you could share a blog about this 😊

I'd really like to learn more about HTMX and maybe once I get to know some of the features it brings then I'd go read up the docs to learn more.

1
S

Hi, thanks for the comment!

Funny you say that I was thinking that I will do a follow up to this article to explore building something in React VS HTMX and try to figure out advantages and disadvantages.

Going back to what I did in the past, the advantage was to write less logic around displaying things.

There are also major advantages for apps that care about SEO with something like Livewire or Hotwire (Need to see if that is true for HTMX). That advantage is that you can display the full page with no javascript and that might make it easier for bots.

Keep an eye out for more articles to come.

1
F

Alright Shane Burgess, I'd keep an eye out for the upcoming articles.

I'm excited to learn about your findings.

1