Hacker News Board Hacker News, browsed like a classic message board
Live data from Hacker News

Show HN: Build progressively enhanced reactive HTML apps using Go and Alpine.js

livefir.fly.dev

Post reply on HN
Print view View original

1–10 of 45 posts

Show HN: Build progressively enhanced reactive HTML apps using Go and Alpine.js

#1

Post by realrocker »

Fir leverages Golang’s standard library html/template package and a bit of alpinejs to allow building reactive UIs. You start with plain old html and use alpinejs to enhance it to bring no-page-reload interactivity to web apps.

The Fir toolkit is designed for Go developers with moderate html/css & js skills who want to progressively build reactive web apps without mastering complex web frameworks. It includes a Go library and an Alpine.js plugin.

How it works ?

On receiving user-interactions the fir server re-renders html templates and sends it over the wire where the fir client library selectively updates the changed areas.

When a user event is received by a Fir route, an array of html templates are rendered on the server and returned as an array of DOM events to the browser. The DOM events are consumed by the alpinejs plugin and dispatched within the DOM where listeners attached to elements can use the event to update the DOM.

See the demo and quickstart here: https://livefir.fly.dev/

Show HN: Build progressively enhanced reactive HTML apps using Go and Alpine.js
livefir.fly.dev

Re: Show HN: Build progressively enhanced reactive HTML apps using Go and Alpine.js

#3

Post by ajd1988 »

The idea of using Go and Alpine.js together for building reactive web apps seems promising. As you mentioned, Fir is targeting devs with moderate HTML/CSS & JS skills.

How does Fir handle more complex scenarios such as nested components, handling form submissions with client-side validation, and integrating third-party APIs or libraries?

Does the toolkit offer any built-in functionality or guidelines for handling these cases, or is the developer expected to handle them using custom code and Alpine.js plugins?

Also the site is super slow!

Re: Show HN: Build progressively enhanced reactive HTML apps using Go and Alpine.js

#4

Post by mtlynch »

hyeomans wrote: post #2

Hope this is constructive feedback: I’m located in México and it takes around 20 seconds to load.

I think it's just getting the HN hug of death. I'm in the US on fiber and seeing timeouts and 30+ second load times.

Re: Show HN: Build progressively enhanced reactive HTML apps using Go and Alpine.js

#6

Post by ryanolsonx »

mtlynch wrote: post #4
hyeomans wrote: post #2

Hope this is constructive feedback: I’m located in México and it takes around 20 seconds to load.

I think it's just getting the HN hug of death. I'm in the US on fiber and seeing timeouts and 30+ second load times.

The hug of death doesn't bode well for the approach.

Re: Show HN: Build progressively enhanced reactive HTML apps using Go and Alpine.js

#7

Post by fshr »

Interesting stuff; is this intended to be an experiment or a longer-term project? I think a straight-forward comparison of Fir and things like HTMX (htmx.org) would be a good addition to the demo page or docs. I’m not one, but from what I gather many golang enthusiasts like using the std http features of the language and other libraries like HTMX seem more appealing as they live just in the html templates. It’d help get a quick idea of how it fits in with existing libraries. For instance, the pubsub feature would be a distinction.

Re: Show HN: Build progressively enhanced reactive HTML apps using Go and Alpine.js

#8

Post by realrocker »

ajd1988 wrote: post #3

The idea of using Go and Alpine.js together for building reactive web apps seems promising. As you mentioned, Fir is targeting devs with moderate HTML/CSS & JS skills. How does Fir handle more complex scenarios such as nested components, handling form submissions with client-side validation, and integrating third-party APIs or libraries? Does the toolkit offer any built-in functionality or guidelines for handling the…

This example has most of the scenarios you have called out: https://github.com/livefir/fir/tree/main/examples/fira. Fir aims to limit itself to rendering templates on the server and making it available for all subscribers as a browser CustomEvent which is consumed by alpine.js for more complex interactivity. The expectation is the that the developer handles it via either alpine.js plugins or standard JS code.

[edit] This is still a work-in-progress so I will certainly add better guides and documentation moving forward. Although its good to get feedback that this approach might be interesting for at least some people.

Re: Show HN: Build progressively enhanced reactive HTML apps using Go and Alpine.js

#9

Post by realrocker »

fshr wrote: post #7

Interesting stuff; is this intended to be an experiment or a longer-term project? I think a straight-forward comparison of Fir and things like HTMX (htmx.org) would be a good addition to the demo page or docs. I’m not one, but from what I gather many golang enthusiasts like using the std http features of the language and other libraries like HTMX seem more appealing as they live just in the html templates. It’d help…

It is intended as a longer-term project originating from the previous experiment: https://github.com/adnaan/gomodest. You are right, a better selection criteria for the target audience should be enlisted. I have been working on this for a while so I just got greedy for some early feedback.

Re: Show HN: Build progressively enhanced reactive HTML apps using Go and Alpine.js

#10

Post by realrocker »

ryanolsonx wrote: post #6
mtlynch wrote: post #4

Earlier quoted context omitted.

I think it's just getting the HN hug of death. I'm in the US on fiber and seeing timeouts and 30+ second load times.

The hug of death doesn't bode well for the approach.

Yeah I was afraid of that. Websockets are costly. Thankfully the approach doesn't completely depend on websockets so I have disabled it for now on the site.
Post reply on HN