Uploaded March 2022 | Updated September 2026, 3 weeks ago
This is the 27th video in the Getting Started with Rails 7 series. In this video Mike adds an element with a Stimulus controller to allow for client-side interactions in the web application. Stimulus comes prepackaged in a new Rails application by default and integrates well with the "Rails Way" of building an application.
Because the interaction is client-side, we use the Rails ApplicationSystemTest case to test the functionality of the Stimulus controller using a browser.
This video covers:
00:00:10 Introduction to Stimulus
00:03:24 Resolve Dependabot alert by running `bundle update`
00:04:46 Create some HTML elements in the root route to which we will add a Stimulus controller
00:06:13 Examine the default hello_controller
00:08:01 Create an ApplicationSystemTestCase to test the WelcomeController Stimulus functionality and write failing test for our initial functionality
00:11:46 Add the data-controller attribute to the DOM element that contains the functionality and overwrite the default behavior
00:13:44 Define targets and add to the appropriate elements and modify tests. Populate initial state in connect() callback.
00:24:08 Add an action to the Get next quote button that replaces the two target elements with new text and makes the Reset button not disabled
00:28:33 Add action to the reset button that resets to initial state
00:30:57 Make the set of quotes an array and refactor out a method for repeated determination of button states and number of quotes remaining.
00:36:31 Make add new use cases to browser tests and add some helper test methods
00:43:06 Fix the agreement in the sentence when there is one quote left and troubleshoot error
00:49:18 Review changes. Commit and push code.
This video is CC0 - No rights reserved. (YouTube doesn't allow this option when publishing.) All code is released under the UNLICENSE. Stateless Code denies the concept of "intellectual property". Copying is not stealing.
This is the 27th video in the Getting Started with Rails 7 series. In this video Mike adds an element with a Stimulus controller to allow for client-side interactions in the web application. Stimulus comes prepackaged in a new Rails application by default and integrates well with the "Rails Way" of building an application.
Because the interaction is client-side, we use the Rails ApplicationSystemTest case to test the functionality of the Stimulus controller using a browser.
This video covers:
00:00:10 Introduction to Stimulus
00:03:24 Resolve Dependabot alert by running `bundle update`
00:04:46 Create some HTML elements in the root route to which we will add a Stimulus controller
00:06:13 Examine the default hello_controller
00:08:01 Create an ApplicationSystemTestCase to test the WelcomeController Stimulus functionality and write failing test for our initial functionality
00:11:46 Add the data-controller attribute to the DOM element that contains the functionality and overwrite the default behavior
00:13:44 Define targets and add to the appropriate elements and modify tests. Populate initial state in connect() callback.
00:24:08 Add an action to the Get next quote button that replaces the two target elements with new text and makes the Reset button not disabled
00:28:33 Add action to the reset button that resets to initial state
00:30:57 Make the set of quotes an array and refactor out a method for repeated determination of button states and number of quotes remaining.
00:36:31 Make add new use cases to browser tests and add some helper test methods
00:43:06 Fix the agreement in the sentence when there is one quote left and troubleshoot error
00:49:18 Review changes. Commit and push code.
This video is CC0 - No rights reserved. (YouTube doesn't allow this option when publishing.) All code is released under the UNLICENSE. Stateless Code denies the concept of "intellectual property". Copying is not stealing.
