A modest JavaScript framework for the HTML you already have

After starting with jQuery in Drupal 6 and moving to full JavaScript frameworks like Vue, I've recently been using Stimulus when adding JavaScript to my projects.

After finding it via SymfonyCasts and Symfony UX (I can't remember if Ryan and I discussed it in our podcast episode), I like that it works on top of my existing HTML and Twig templates instead of having to rewrite or duplicate all the markup.

You enable and configure it with data attributes like data-controller and data-action in your HTML which refer to separate JavaScript classes and methods, so you have some structure and organisation compared to putting all the logic in Twig.

Having separate controllers also makes it easy to reuse logic in other parts of your application or extract it for use in other projects.

If you want an example of how I've set up stimulus with esbuild, take a look at this GitHub repository, or watch the Stimulus course on SymfonyCasts.

I skipped the lessons on Stimulus before and didn't try it for a while, but I'm glad I have.