Include user interaction example

[JensRoland]

Love the clean back-to-basics syntax of Enhance! Great work!

One thing that I feel is missing from the docs is how to implement interactivity, since the developer ergonomics of binding syntax is one of the key differentiators in other frameworks.

It could be as complex as a full TodoMVC app or as simple as a "click a button to update some state" example. I wanted to recreate the 'CounterButton' example from this blog post: https://joshcollinsworth.com/blog/introducing-svelte-comparing-with-react-vue#authoring-svelte-components, but ended up having to use the enhance('counter-button', { ... }) syntax, which felt like a step back into non-standard module land.

I understand that Enhance is meant to enhance vanilla JavaScript, and as such it may not offer any syntactic sugar for value binding, but even so, it would be helpful to include a best-practice example of how it should be done.

[macdonst]

@JensRoland I did a blog post with a counter example:

https://blog.begin.com/posts/2022-10-14-web-components-server-side-rendering-and-progressive-enhancement

Is that along the lines of what you are looking for?

[JensRoland]

Yes, that’s fantastic! It’s a little more terse than I’d hoped, but at the same time I can appreciate the commitment to true progressive enhancement.

[macdonst]

@JensRoland did you mean the code is a bit terse? How can it be improved to be more explicit?

I'm re-opening the issue so we can add more docs around this topic.

[JensRoland]

I’m sorry, no I just meant the PE pattern requires significantly more code to achieve a dynamic counter than the frameworks demoed in the link I posted, making it a little bit harder to ‘sell’ to developers who grew up in the SPA era.

I guess I was hoping for some syntactic sugar to replace the JS selection-and-event-housekeeping parts of the StateCounter class. I would think something in the vein of htmx would feel like a natural extension of Enhance.

[macdonst]

@JensRoland it's coming soon. PE is going to be way easier with Enhance in the not to distant future.

[JensRoland]

Amazing news! I’m really excited to see what you come up with - there’s so many benefits to the html-first approach and Enhance has quite possibly the most elegant implementation of a modern html-first framework that I’ve seen.