Practical Stimulus

In this series of articles, we'll learn how to accomplish common front-end tasks using Stimulus. If you want to try Stimulus in your projects but don't know whether it will be a good fit, you'll find this series useful.

4 Articles

Using Hotwire for Inline Form Updates Without Form Submission

Sometimes you need dynamic content on the form, where parts of the form update based on the user input. This post shows how to use Hotwire's Turbo and Stimulus libraries for in-place form updates by loading data from the server, without submitting the form, which happens only once, at the end.

Hotwire 6 min read

Practical Stimulus: Building a Counter Component

In this article, we will build a counter component using the Stimulus JavaScript library. This simple example will demonstrate a bunch of useful features of Stimulus such as managing state, handling events, and targeting DOM elements.

Practical Stimulus 4 min read

Practical Stimulus: How to Toggle CSS Classes

This second article in the 'Stimulus in Practice' series shows how you can work with HTML classes using Stimulus. Specifically, we'll learn how to toggle classes on an element. This is useful when you want to show or hide certain elements or update the design in response to user interaction.

Practical Stimulus 5 min read

Practical Stimulus: Capture User Input

Stimulus is a JavaScript library that works really well with the HTML-over-the-wire approach of building web applications. In this series of articles, we'll learn how to accomplish common front-end tasks using Stimulus. This post shows how to capture user input and display it on the screen.

Practical Stimulus 6 min read