# Stimulus

Published articles for Stimulus.

This is one page of public article previews, not the complete archive. Follow Next page to continue. Summaries are not the original full articles.

## Building a (Very) Simple Responsive Search with Rails & Stimulus

DevFeed: [Building a (Very) Simple Responsive Search with Rails & Stimulus](<https://devfeed.tech/articles/building-a-very-simple-responsive-search-with-rails-stimulus-20113.md>)

Original publisher: [Read original article](<https://hashrocket.com/blog/posts/building-a-simple-search-with-rails-stimulus>)

Author: Jack Rosa

Published: 2025-12-09T14:00:00Z

Content type: tutorial

Language: en

Sources: [Hashrocket](<https://devfeed.tech/sources/hashrocket.md>)

Topics: [Rails](<https://devfeed.tech/topics/rails.md>), [Stimulus](<https://devfeed.tech/topics/stimulus.md>), [Framework](<https://devfeed.tech/topics/framework.md>)

Tags: [building](<https://devfeed.tech/tags/building.md>), [hotwire](<https://devfeed.tech/tags/hotwire.md>), [rails](<https://devfeed.tech/tags/rails.md>), [search](<https://devfeed.tech/tags/search.md>), [side-project](<https://devfeed.tech/tags/side-project.md>), [stimulus](<https://devfeed.tech/tags/stimulus.md>), [turbo](<https://devfeed.tech/tags/turbo.md>)

### AI overview

A tutorial for building a responsive search form with Rails and Stimulus. It demonstrates debounced input submission, a clear-input button, and updating search results inside a Turbo Frame without a full-page reload.

### Source excerpt

Here's a simple and responsive search form I put together for a recent side project, using Hotwire's Stimulus framework and Rails with Turbo. The Form Here's how the search input looks. It's a simple search form connected to a Stimulus controller. The input triggers the search function upon every input event. The debounce logic occurs in the Stimulus controller to make sure not too many requests are made to the server: <%= form_with url: items_path, method: :get, data: { controller: "search", turbo_frame: "items_list" } do |f| %> <%= f.text_field :query, placeholder: "Search...", data: { search_target: "input", action: "input->search#search" } %> <button type="button" class="hidden" data-search-target="clearButton" data-action="click->search#clear"> x </button> <% end %> There's an additional feature here: a button which appears in the search field whenever the field has a value. The button has a data-action attribute pointing to the clear action. If the button is clicked, the input value is cleared out. The Stimulus Controller All we need to do here is submit the form with a debounce timer, handle the action for clicking the clear input button, and handle hiding the clear button if the input field has a value or not. export default class extends Controller { static targets = ["input", "clearButton"] connect() { this.toggleClear() } search() { this.toggleClear() clearTimeout(this.timeout) this.timeout = setTimeout(() => { this.element.requestSubmit() }, 300) } clear() { this.inputTarget.value = "" this.toggleClear() this.element.requestSubmit() } toggleClear() { if (this.inputTarget.value.length > 0) { this.clearButtonTarget.classList.remove("hidden") } else { this.clearButtonTarget.classList.add("hidden") } } } The Turbo Frame You'll notice the form targets an items_list turbo frame, which contains your search results in the view. When the Stimulus controller submits the form, the content inside this frame gets replaced with the new search results. This is a pretty

## Creating a Custom Mobile Integration for a Board Game Using Ruby on Rails

DevFeed: [Creating a Custom Mobile Integration for a Board Game Using Ruby on Rails](<https://devfeed.tech/articles/creating-a-custom-mobile-integration-for-a-board-game-using-ruby-on-rails-20115.md>)

Original publisher: [Read original article](<https://hashrocket.com/blog/posts/creating-a-custom-mobile-integration-for-a-board-game-using-ruby-on-rails>)

Author: Craig Hafer

Published: 2025-12-04T14:00:00Z

Content type: tutorial

Language: en

Sources: [Hashrocket](<https://devfeed.tech/sources/hashrocket.md>)

Topics: [board-game](<https://devfeed.tech/topics/board-game.md>), [Ruby on Rails](<https://devfeed.tech/topics/ruby-on-rails.md>), [Mobile](<https://devfeed.tech/topics/mobile.md>), [Tailwind CSS](<https://devfeed.tech/topics/tailwind.md>), [Database](<https://devfeed.tech/topics/database.md>), [Stimulus](<https://devfeed.tech/topics/stimulus.md>)

Tags: [board-game-app](<https://devfeed.tech/tags/board-game-app.md>), [mobile](<https://devfeed.tech/tags/mobile.md>), [postgresql](<https://devfeed.tech/tags/postgresql.md>), [rails](<https://devfeed.tech/tags/rails.md>), [ruby](<https://devfeed.tech/tags/ruby.md>), [ruby-on-rails](<https://devfeed.tech/tags/ruby-on-rails.md>), [stimulus](<https://devfeed.tech/tags/stimulus.md>), [tailwind](<https://devfeed.tech/tags/tailwind.md>)

### AI overview

A tutorial on building a mobile version of the Analyzer mechanism from the 1973 Parker Brothers board game Billionare. The project uses Ruby on Rails, Tailwind, PostgreSQL, and Stimulus, with the goal of supporting a broader library of board game helpers.

### Source excerpt

Picture this: you find a charming old board game at a garage sale, bring it home, gather some friends--and snap. The 50-year-old plastic components break instantly. You search the web for help to replace this fun and unique game mechanic but there's nothing to be found. So naturally, you roll up your sleeves and build your own mobile version. No one else does this? Just me? Well, in case you ever find yourself in a similar boat, I figured I would walk you through what I did when building my own mobile integration to the 1973 Parker Brothers classic Billionare. As I said, right when I went to try out this cool "new" board game for the first time, the plastic ends of the Analyzer snapped. The analyzer is basically a plastic rod with 2 floating spinners on them. The spinners, when rotated, will either land with a red face or a green face. You then refer to the chart to see what action to take. I thought this was such a unique way to give a random effect in a game, without relying on dice. It essentially is just a random binary spinner that counts up to 4. Here is what it looks like for reference: So, without any 4 sided die lying around, and not wanting to use a boring random number generator, my brain went right to what it knows best---Ruby on Rails. So without further ado, here's what I did and how you can do something similar yourself. Creating the app Sure, Rails could be considered overkill for such a simple app. But my idea is to allow this project to scale into a whole library of board game helpers that can all live within the same app. So, to start off I ran the old trusty rails new command, with a couple preferences I like to pass in to make my life easier as a developer. rails new board_game_library --css tailwind --database=postgresql One of the main tools I leveraged for this project besides Rails was Tailwind. Tailwind makes styling so easy. Here at Hashrocket Tailwind is pretty standard for all of us, so if you're interested in any tips or tricks, we have

## A refreshing take: using serverside rendering to reduce fragile DOM state

DevFeed: [A refreshing take: using serverside rendering to reduce fragile DOM state](<https://devfeed.tech/articles/a-refreshing-take-using-serverside-rendering-to-reduce-fragile-dom-state-29998.md>)

Original publisher: [Read original article](<https://engineering.freeagent.com/2025/10/17/a-refreshing-take-using-serverside-rendering-to-reduce-fragile-dom-state/>)

Author: Simon Fish

Published: 2025-10-17T08:33:59Z

Content type: article

Language: en

Sources: [FreeAgent](<https://devfeed.tech/sources/freeagent.md>)

Topics: [Hotwire](<https://devfeed.tech/topics/hotwire.md>), [Front end](<https://devfeed.tech/topics/frontend.md>), [Rails](<https://devfeed.tech/topics/rails.md>), [Stimulus](<https://devfeed.tech/topics/stimulus.md>), [WebSocket](<https://devfeed.tech/topics/websocket.md>), [Document Object Model (DOM)](<https://devfeed.tech/topics/dom.md>), [tbox](<https://devfeed.tech/topics/tbox.md>)

Tags: [browser](<https://devfeed.tech/tags/browser.md>), [development](<https://devfeed.tech/tags/development.md>), [frontend](<https://devfeed.tech/tags/frontend.md>), [hotwire](<https://devfeed.tech/tags/hotwire.md>), [html-elements](<https://devfeed.tech/tags/html-elements.md>), [js](<https://devfeed.tech/tags/js.md>), [rails](<https://devfeed.tech/tags/rails.md>), [ruby-on-rails](<https://devfeed.tech/tags/ruby-on-rails.md>), [stimulus](<https://devfeed.tech/tags/stimulus.md>), [streams](<https://devfeed.tech/tags/streams.md>), [websocket](<https://devfeed.tech/tags/websocket.md>)

### AI overview

This article examines FreeAgent's use of server-side rendering with Hotwire, Turbo, Stimulus, and Rails to reduce fragile DOM state. It explains how Turbo Streams and Action Cable can update browser pages asynchronously, contrasting these behaviors with the original DOM-manipulation actions.

### Source excerpt

Hotwire is central to how we drive the frontend at FreeAgent, and Action Cable allows us to send Turbo Streams as users browse the site, adding a layer of richness to the user experience.

## Announcing Hotwire Spark: live reloading for Rails applications

DevFeed: [Announcing Hotwire Spark: live reloading for Rails applications](<https://devfeed.tech/articles/announcing-hotwire-spark-live-reloading-for-rails-applications-33499.md>)

Original publisher: [Read original article](<https://dev.37signals.com/announcing-hotwire-spark-live-reloading-for-rails/>)

Author: Jorge Manrubia

Published: 2024-12-18T18:00:00Z

Content type: release

Language: en

Sources: [37signals Dev](<https://devfeed.tech/sources/37signals-dev.md>)

Topics: [Hotwire](<https://devfeed.tech/topics/hotwire.md>), [Rails](<https://devfeed.tech/topics/rails.md>), [Stimulus](<https://devfeed.tech/topics/stimulus.md>), [Front end](<https://devfeed.tech/topics/frontend.md>)

Tags: [css](<https://devfeed.tech/tags/css.md>), [frontend](<https://devfeed.tech/tags/frontend.md>), [hotwire](<https://devfeed.tech/tags/hotwire.md>), [html](<https://devfeed.tech/tags/html.md>), [rails](<https://devfeed.tech/tags/rails.md>), [stimulus](<https://devfeed.tech/tags/stimulus.md>)

### AI overview

37signals announces Hotwire Spark, a live-reloading system for Rails applications. It automatically updates the current page when HTML, CSS, or Stimulus controller source changes, using smooth page morphing, stylesheet reloads, and controller replacement without bundling or frontend build tooling.

### Source excerpt

Improve your feedback loop with smooth automatic page updates.

## A vanilla Rails stack is plenty

DevFeed: [A vanilla Rails stack is plenty](<https://devfeed.tech/articles/a-vanilla-rails-stack-is-plenty-33494.md>)

Original publisher: [Read original article](<https://dev.37signals.com/a-vanilla-rails-stack-is-plenty/>)

Author: Jorge Manrubia

Published: 2024-12-12T18:00:00Z

Content type: opinion

Language: en

Sources: [37signals Dev](<https://devfeed.tech/sources/37signals-dev.md>)

Topics: [Rails](<https://devfeed.tech/topics/rails.md>), [Hotwire](<https://devfeed.tech/topics/hotwire.md>), [PWA](<https://devfeed.tech/topics/pwa.md>), [Ruby](<https://devfeed.tech/topics/ruby.md>), [Stimulus](<https://devfeed.tech/topics/stimulus.md>), [Web Development](<https://devfeed.tech/topics/web-development.md>)

Tags: [frameworks](<https://devfeed.tech/tags/frameworks.md>), [hotwire](<https://devfeed.tech/tags/hotwire.md>), [pwa](<https://devfeed.tech/tags/pwa.md>), [rails](<https://devfeed.tech/tags/rails.md>), [ruby](<https://devfeed.tech/tags/ruby.md>), [stimulus](<https://devfeed.tech/tags/stimulus.md>), [test](<https://devfeed.tech/tags/test.md>)

### AI overview

The article recommends a vanilla Rails 8 stack with minimal Ruby and JavaScript dependencies, server-rendered views, Hotwire, import maps, standard CSS, relational-database-backed services, Minitest, PWAs, and Kamal deployment. It presents this approach as 37signals' balance of productivity, user experience, and long-term maintainability.

### Source excerpt

Minimal dependencies, maximum productivity. Staying vanilla pays long term dividends for your Rails apps.

## Announcing Hotwire Native

DevFeed: [Announcing Hotwire Native](<https://devfeed.tech/articles/announcing-hotwire-native-33498.md>)

Original publisher: [Read original article](<https://dev.37signals.com/announcing-hotwire-native/>)

Author: Jay Ohms

Published: 2024-09-25T17:00:00Z

Content type: release

Language: en

Sources: [37signals Dev](<https://devfeed.tech/sources/37signals-dev.md>)

Topics: [Hotwire](<https://devfeed.tech/topics/hotwire.md>), [Mobile](<https://devfeed.tech/topics/mobile.md>), [Android](<https://devfeed.tech/topics/android.md>), [Framework](<https://devfeed.tech/topics/framework.md>), [iOS](<https://devfeed.tech/topics/ios.md>), [web applications](<https://devfeed.tech/topics/web-applications.md>)

Tags: [announcement](<https://devfeed.tech/tags/announcement.md>), [build](<https://devfeed.tech/tags/build.md>), [hotwire](<https://devfeed.tech/tags/hotwire.md>), [kotlin](<https://devfeed.tech/tags/kotlin.md>), [mobile](<https://devfeed.tech/tags/mobile.md>), [mobile-apps](<https://devfeed.tech/tags/mobile-apps.md>), [stimulus](<https://devfeed.tech/tags/stimulus.md>), [swift](<https://devfeed.tech/tags/swift.md>), [web](<https://devfeed.tech/tags/web.md>)

### AI overview

37signals announces Hotwire Native, a framework that consolidates Turbo Native and Strada for building hybrid mobile apps on iOS and Android. It supports a web-first approach that reuses existing Hotwire web apps while allowing selected screens or components to be implemented natively in Swift or Kotlin.

### Source excerpt

The web-first framework for building native mobile apps.

## Astro 3.4: Page Partials

DevFeed: [Astro 3.4: Page Partials](<https://devfeed.tech/articles/astro-3-4-page-partials-3179.md>)

Original publisher: [Read original article](<https://astro.build/blog/astro-340/>)

Author: Erika; Matthew Phillips

Published: 2023-10-26T00:00:00Z

Content type: release

Language: en

Sources: [The Astro Blog](<https://devfeed.tech/sources/the-astro-blog.md>)

Topics: [Astro](<https://devfeed.tech/topics/astro.md>), [releases](<https://devfeed.tech/topics/releases.md>), [htmx](<https://devfeed.tech/topics/htmx.md>), [Optimization](<https://devfeed.tech/topics/optimization.md>), [Stimulus](<https://devfeed.tech/topics/stimulus.md>), [Accessibility](<https://devfeed.tech/topics/accessibility.md>)

Tags: [accessibility](<https://devfeed.tech/tags/accessibility.md>), [astro](<https://devfeed.tech/tags/astro.md>), [htmx](<https://devfeed.tech/tags/htmx.md>), [optimization](<https://devfeed.tech/tags/optimization.md>), [performance](<https://devfeed.tech/tags/performance.md>), [plugin](<https://devfeed.tech/tags/plugin.md>), [releases](<https://devfeed.tech/tags/releases.md>), [stimulus](<https://devfeed.tech/tags/stimulus.md>)

### AI overview

Astro 3.4 introduces page partials, an experimental development overlay with plugin support, and faster image generation during builds. The release also includes additional bug fixes.

### Source excerpt

Astro 3.4 is now released with support for page partials, improved image optimization performance, and an early preview of a new dev overlay.