Popularity
7.0
Stable
Activity
6.3
Declining
7,410
203
186

Description

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 Turbolinks to provide a complete solution for fast, compelling applications with a minimal amount of effort.

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

Programming language: TypeScript

Stimulus alternatives and similar libraries

Based on the "MVC Frameworks and Libraries" category

Do you think we are missing an alternative of Stimulus or a related project?

Add another 'MVC Frameworks and Libraries' Library
Proactively identify front-end issues with easy-to-build synthetics tests. 14-day free trial.
More from our partner

Popular Comparisons

SaaSHub - Software Alternatives and Reviews
More from our team

README

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 Turbolinks 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-target="hello.name" type="text">

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

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

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

// hello_controller.js
import { Controller } from "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 Turbolinks 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

Stimulus integrates with the webpack asset packager to automatically load controller files from a folder in your app.

You can use Stimulus with other asset packaging systems, too. 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 & Contributing Back

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 Stimulus Discourse community forum.

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](CODE_OF_CONDUCT.md).

Acknowledgments

Stimulus is [MIT-licensed](LICENSE.md) open-source software from Basecamp, the creators of Ruby on Rails.

Continuous integration is generously provided by open-source grants from CircleCI, Sauce Labs, and Travis CI.

© 2018 Basecamp, LLC.


*Note that all licence references and agreements mentioned in the Stimulus README section above are relevant to that project's source code only.