Let’s create a Trix Editor plugin using Stimulus.js

I’ve been working on an app that uses Trix to edit a very complicated book text. Someone asked if I could add the ability to choose different sizes of text while they are editing the book. After digging around online, I came across this example from Javan, one of Trix’s creators: https://codepen.io/javan/pen/EPqzZo. This was exactly […]

Don’t accidentally walk away from your Active Storage Uploads with Stimulus.js

I’ve recently been using Active Storage, and it has a really neat feature called Direct Uploads. Active Storage asks your app for a URL for uploading each file, and then proceeds to upload the file directly to your storage service, without having to tax your app server’s processor. But if you’ve selected a lot of […]

Stimulus.js Tutorial – Don’t Lose Unsaved Form Fields

You may shudder remembering that long form you were once filling out, only to accidentally click a link, or refresh the page. You lost everything, all your unsaved form entries, and then you had to redo your work and fill out the form again. Don’t let your customers fall into the same trap. There are […]

Stimulus.js Tutorial: Implementing Radio Selection In A Form

Let’s say your building a really fancy UI, and you don’t want to use plain old radio buttons in your form. You might have a list of items, and you’d like your customer to select one of them. You also don’t want them to submit the form without selecting an item. Here’s an example of […]

Stimulus.js Tutorial: How Do I Remotely Update My Model from a checkbox?

An updated version of this post can be found here: https://onrails.blog/2020/11/09/updated-tutorial-how-do-i-update-my-model-from-a-checkbox/ First, I’m going to assume you’ve read the Stimulus handbook, cover to cover, like I have. Let’s say you have a Todo app, with a model Todo that has a string title, and a boolean field, completed. We are going to use Stimulus to […]