hotwired/stimulus

★ 13,041TypeScriptAudience · developerComplexity · 2/5LicenseSetup · easy

Mindmap

mindmap
  root((stimulus))
    How it works
      HTML data attributes
      Controllers
      Targets and actions
    Use cases
      Server-rendered apps
      Rails and Django
      Turbo companion
    Tech stack
      TypeScript
      npm package
      Script tag option
    Audience
      Backend developers
      Rails developers

mindmap root((stimulus)) How it works HTML data attributes Controllers Targets and actions Use cases Server-rendered apps Rails and Django Turbo companion Tech stack TypeScript npm package Script tag option Audience Backend developers Rails developers

Click or tap to explore — scroll the page freely

Things people build with this

USE CASE 1

Add dropdowns, modals, or form validation to a Rails or Django app without switching to a full frontend framework.

USE CASE 2

Connect HTML elements to JavaScript controllers using data attributes, with no build step required.

USE CASE 3

Pair with Turbo to build fast server-rendered web apps with minimal client-side JavaScript.

USE CASE 4

Replace scattered jQuery event handlers with organized, attribute-driven Stimulus controllers.

Tech stack

TypeScriptJavaScriptnpm

Getting it running

Difficulty · easy Time to first run · 5min

Use freely for any purpose, including in commercial projects, with no restrictions beyond keeping the copyright notice.

In plain English

Stimulus is a small JavaScript framework made by Basecamp, the company behind Ruby on Rails. Rather than taking over how a page is built or rendered, it adds interactive behavior to HTML that already exists on the page. This makes it a natural fit for server-rendered applications that want some client-side behavior without switching to a heavier frontend framework. The way it works is through special HTML attributes. You mark elements with attributes that say which controller manages a section of the page, which elements a controller can read from or write to, and which user actions should trigger which methods. Stimulus watches the page for these attributes and connects the right JavaScript controller to the right HTML elements automatically, handling setup and teardown as elements appear and disappear. Because Stimulus reads the current state of the DOM rather than managing its own rendering, it works cleanly alongside server-side rendering, Turbo (a companion library from the same team for fast page navigation without full reloads), and any other tools that update the page through Ajax or HTML swaps. Stimulus does not need to know who updated the page, it just responds to what is there. The framework is written in TypeScript and published as an npm package. It can also be added with a plain script tag, requiring no build step. The documentation includes a handbook for getting started and a reference guide for the full API. Stimulus is open source under an MIT license.

Copy-paste prompts

Prompt 1

Create a Stimulus controller that shows and hides a dropdown menu when a button is clicked, using targets and actions.

Prompt 2

Add a Stimulus controller to a Rails form that validates the email field in real time and displays an inline error message.

Prompt 3

How do I include Stimulus on a plain HTML page using only a script tag, without any build step?

Prompt 4

Write a Stimulus controller that fetches JSON from an API endpoint when a button is clicked and updates a list on the page.

Prompt 5

Convert this jQuery click handler into a Stimulus controller with proper targets, actions, and connect lifecycle.

Open on GitHub → Explain another repo

← hotwired on gitmyhub — every repo by this author, as a profile.

Verify against the repo before relying on details.