Sprinkle Javascript with StimulusJS
Submitted by Leena S N (@leenasn) on Sunday, 4 August 2019
Section: Crisp talk (20 mins) Technical level: Intermediate
Abstract
In this world of Microservices, I am building a Monolith app. In this world of React and Vue, am building a server-side rendered app.
However, I need Javascript. I can’t avoid that. I need some parts of the page updated dynamically. I need to show/hide certain parts of the page depending upon user actions.
I don’t want JQuery for the obvious reasons. Slow.., Heavy and then, of course, it can easily create spaghetti code.
That is when I came across Stimulus JS - a modest Javascript framework. It sprinkles Javascript to add behaviour to your HTML.
It has a controller, action and targets (i.e. the HTML elements). Moreover, it pairs well with Turbolinks. So I don’t need to do the circus of converting JSON to DOM.
I’ve been using Stimulus for over a year and its been quite good. This talk is about my experiences with Stimulus with a few examples. I will share recommendations on where it might be useful and where it is not.
Outline
- Quick introduction about StimulusJS
- A quick example
- A few more examples (where I’ve used Stimulus for my product)
- Recommendations, Pros, Cons, Further References
Speaker bio
Co-founder/CTO/Programmer @ Good Karma, Bangalore.
A pragmatic & passionate programmer, lean thinker, eXtreme Programming evangelist, hooked into Continuous Delivery. A mother of two lovely angels.
Links
- https://stimulusjs.org/
- A detailed writeup about this session: https://medium.com/continuousdelivery/do-one-thing-really-well-d8d3ea2a271d
Slides
https://www.slideshare.net/leenasn/sprinkle-javascript-using-stimulus-jsComments
-
-
Zainab Bawa (@zainabbawa) Reviewer 2 months ago
Thank you for the rehearsal, Leena. Here are the points of feedback:
- Add a slide on lessons learned, to clarify thee takeaways for participants.
- What kind of projects can benefit from Stimulus? Explain your motivation to use Stimulus.
- Explain details such as controller, etc. How will you slice html and css with StimulusJS? How do you decide which particular controllers to use with StimulusJS?
- Then go deep dive into code.
- Add a building blocks slide at the end.
- End application created – a screenshot or demo will be good to have at the end.
- Other frameworks – why did they not qualify? Explain in detail.
- How do you bundle Stimulus with HTML?
Incorporate the above feedback by 25 September latest so that we can review the second iteration and conclude with final feedback, if any.
Thanks for this proposal, Leena. I have the following questions for your presentation:
Look forward to this presentation at JSFoo.