Search⌘ K

Stimulus Quick Reference

Explore how to use Stimulus to enhance HTML with minimal JavaScript by understanding its naming conventions, controller setup, targets, values, and classes. This lesson helps you quickly reference essential Stimulus patterns, enabling you to build interactive web features smoothly in Rails before moving on to more complex frameworks like React.

We'll cover the following...

Stimulus is small, but the conventions need to be hit exactly for it to work. Therefore, a quick reference table helps a lot. The basics of Stimulus can fit in the simple table that follows, with the naming conventions mimicking the expected case of the value.

Basics of Stimulus

Item

Attribute

Naming Convention

Controller

data-controller

controller-name

Action

data-action

event->controller-name#methodName

Target

data-controller-name-target

targetName

Value

data-controller-name-attribute-name-value

value

Class

data-controller-name-description-class

value

Some notes on semantics:

  • A controller declared as controller-name assumes the existence of a file app/packs/controller/controller_name_controller
...