Skip to content

Blogging On Rails

Everything on Rails!

Stimulus.js Tutorial – Multiple Selects that Filter Enterprise Data Models

If you have a lot of records that fall into many different buckets, it can be hard to filter all of that complex data record. Thankfully, we can string together a couple select fields to filter based on multiple, disparate categories. This might be like something you’d see on a car shopping website, where you Continue reading “Stimulus.js Tutorial – Multiple Selects that Filter Enterprise Data Models”

Stimulus.js Tutorial – Using multi select to pare down a large set of data

Now that we have a lot of books in our library system, it would be great if we could quickly filter the books based on their category. HTML supplies a nifty builtin tag, called multi select, that will let us display a couple options. Our librarians can then select one category, or a couple of Continue reading “Stimulus.js Tutorial – Using multi select to pare down a large set of data”

Modeling More Complex Datasets In Rails

Let’s say your company manages books. And not like account records, but perhaps books in a store, or a catalog of books available to check out. Books present a more complicated data model because there are so many of them! And there are many attributes that you might want to track, starting with the title Continue reading “Modeling More Complex Datasets In Rails”

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 Continue reading “Let’s create a Trix Editor plugin using Stimulus.js”

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 Continue reading “Don’t accidentally walk away from your Active Storage Uploads with Stimulus.js”

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 Continue reading “Stimulus.js Tutorial – Don’t Lose Unsaved Form Fields”

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 Continue reading “Stimulus.js Tutorial: Implementing Radio Selection In A Form”

Let’s Make an Editable Header using Stimulus.js

Stimulus excels at adding sprinkles of interactivity to your web apps. Let’s say you want to make an element on your page editable, like a todo entry, or a title for your blog page. We can use a Stimulus controller that will listen for a double click event, insert an input tag that looks just Continue reading “Let’s Make an Editable Header using Stimulus.js”

Stimulus + Trix: Convert Emoji Short Codes To Unicode Characters On The Fly

Let’s Add an Emoji Converter to Trix with Stimulus We’ve been exploring using Stimulus to add interactivity to our apps. Let’s use Stimulus to watch for typing changes, and convert an emoji short code into the actual glyph, such as :smiley: to 😀 Getting Started I’ve uploaded my code to Github, so you can follow Continue reading “Stimulus + Trix: Convert Emoji Short Codes To Unicode Characters On The Fly”

Is using Webpack in Rails worth it?

If you’ve been paying attention to the larger development ecosystem, Javascript is the rage. For example, ”GitHub is home to open source projects written in 337 unique programming languages—but especially JavaScript.“ There are many Javascript frontends available, and even the backends are written in Javascript. But if you love Ruby like I do, using more Continue reading “Is using Webpack in Rails worth it?”

Copyright © 2022 John Beatty. All rights reserved.