stimulus README

The project's README from github.com/hotwired/stimulus. As one markdown file: README.md.

Stimulus Stimulus

A modest JavaScript framework for the HTML you already have

Stimulus is a JavaScript framework with modest ambitions. It doesn't seek to take over your entire front-end—in fact, it's not concerned with rendering HTML at all. Instead, it's designed to augment your HTML with just enough behavior to make it shine. Stimulus pairs beautifully with Turbo to provide a complete solution for fast, compelling applications with a minimal amount of effort.

How does it work? Sprinkle your HTML with controller, target, and action attributes:

<div data-controller="hello">
  <input data-hello-target="name" type="text">

  <button data-action="click->hello#greet">Greet</button>

  <span data-hello-target="output"></span>
</div>

Then write a compatible controller. Stimulus brings it to life automatically:

// hello_controller.js
import { Controller } from "@hotwired/stimulus"

export default class extends Controller {
  static targets = [ "name", "output" ]

  greet() {
    this.outputTarget.textContent =
      `Hello, ${this.nameTarget.value}!`
  }
}

Stimulus continuously watches the page, kicking in as soon as attributes appear or disappear. It works with any update to the DOM, regardless of whether it comes from a full page load, a Turbo page change, or an Ajax request. Stimulus manages the whole lifecycle.

You can write your first controller in five minutes by following along in the Stimulus Handbook.

You can read more about why we created this new framework in The Origin of Stimulus.

Installing Stimulus

You can use Stimulus with any asset packaging systems. And if you prefer no build step at all, just drop a <script> tag on the page and get right down to business.

See the Installation Guide for detailed instructions.

Getting Help

Looking for the docs? Once you've read through the Handbook, consult the Stimulus Reference for API details.

Have a question about Stimulus? Connect with other Stimulus developers on the Hotwire Discourse community forum.

Contributing Back

Find a bug? Head over to our issue tracker and we'll do our best to help. We love pull requests, too!

We expect all Stimulus contributors to abide by the terms of our Code of Conduct.

Development

Acknowledgments

Stimulus is MIT-licensed open-source software from Basecamp, the creators of Ruby on Rails.

© 2024 Basecamp, LLC.

stimulus (hotwired/stimulus)

Searching Database…

13.1K ·GitHub
Stimulus
What is this?Stimulus is a small JavaScript framework that adds behavior to the HTML you already have, instead of rendering HTML itself.
Is it a full front-end framework like React, or something lighter?It has modest ambitions: it doesn't take over your front-end or render HTML, it just augments existing server-rendered HTML with controller, target, and action attributes.
How do I add it to a project?You can use it with any asset packaging system, or skip the build step entirely and just drop a script tag on the page.
Do I need any other framework to use it?No, Stimulus works standalone, but it's designed to pair especially well with Turbo for building fast apps with minimal effort.
How does it detect when to activate my controllers?It continuously watches the DOM and kicks in automatically whenever controller/target/action attributes appear or disappear, regardless of whether the change comes from a full load, Turbo navigation, or Ajax.
Who is this mainly built for?It comes from Basecamp, the creators of Ruby on Rails, and fits teams doing server-rendered HTML apps who want sprinkles of JS behavior rather than a full SPA rewrite.
How do I write my first controller?Follow the Stimulus Handbook, which walks through writing a controller in about five minutes.
Where can I find API details beyond the basics?Once you've read the Handbook, the Stimulus Reference covers detailed API documentation.
Why was Stimulus created instead of using an existing SPA framework?The README points to 'The Origin of Stimulus' article explaining the reasoning, essentially favoring augmenting server-rendered HTML over full client-side rendering.
What are similar projects?impress.js, hono, reactionview, uikit, pico, mitosis, hyperapp, riot
Which topics is it in?ruby-on-rails, no-dependencies, web-framework, html, web-development, framework, npm, frontend, library, typescript, javascript, web
Creator
hotwired
Size
4.1 MB
Stars
13.1K
Updated
CommitJul 25Releasev3.2.2Aug 07
Age
9y
Commits · 90 Days