My preferred tech stack so far:

• Elixir and Phoenix LiveView. This gets me really really far into what I need to do, both on the backend and frontend.
• AlpineJS for light user interaction like dropdowns and hiding/showing elements. The benefit here is that I can write regular EEX and LEEX the same way and AlpineJS still works, thanks to this PR.
• Vue for heavy user interaction like WYSIWYG editors. When using LiveView, I have to be conscience of where mounting is occuring
  • if it’s EEX then there’s nothing unusual and Vue will pick up the HTML after page-load and do it’s normal thing
  • if it’s LEEX then I have to ensure that a LiveView JS hook is mounting the Vue after LiveView mounts the elements.
• TailwindCSS for styling. This is incredibly declarative and puts the css closer to the HTML which I’ve enjoyed. It pairs nicely with AlpineJS which is similar in philosophy (declarative). Some might think this is pure CSS soup, but I don’t see it that way. There are plenty of moments where I extract to a CSS class to keep it more succinct (a .nav-link class for example). I’ve also bought into Tailwind UI to help me prototype faster.

Should try Unpoly.

But yeah, I focus on the site working in full without javascript, then I sprinkle in javascript to just make it ‘better’, but never required (unpoly works really well for this progressive enhancement).

I use both of the approaches, but I really like Turbolinks + Stimulus.