Over the past few months, I've been exploring the Hotwire framework from Basecamp. Hotwire includes the use of Turbo for enhanced performance and Stimulus for dynamic interactions. There is something very enticing about the Hotwire philosophy and the way it drives...
JavaScript
Using Nested Stimulus Controllers With Hotwire And Lucee CFML
The other day, on the Hotwire Dev Forum, I was having a discussion about communicating across Stimulus controllers. Most of my explorations so far have revolved around Turbo and progressively enhancing a ColdFusion application. As such, I didn't have much to offer in...
Styling Submit Buttons During Form Submission With Hotwire And Lucee CFML
When you submit a form in a Hotwire enhanced ColdFusion application, several things happen: The progress bar may be rendered if the request takes a while; the targeted submit button will be disabled (in order to prevent double-submissions); and, as of the Turbo v7.3.0...
Creating Custom Turbo Stream Actions In Hotwire And Lucee CFML
The Hotwire Turbo framework uses <turbo-stream> elements to apply targeted DOM (Document Object Model) manipulations to the current page. These Turbo Stream elements can be rendered in response to a Form POST; or, as we saw yesterday, they can be returned inline...
Rendering Elements After The HEAD Tag In JavaScript
The other day, when I was exploring the progress bar in Hotwire, I noticed that the <div> implementing the progress bar was injected into the DOM (Document Object Model) after the <head> tag and before the <body> tag. I didn't know that it was...
Updating Permanent Elements On Page Navigation In Hotwire Turbo And Lucee CFML
In a Hotwire Turbo application, when you add the data-turbo-permanent attribute to an element (accompanied by an id attribute), this element will be cached and then replaced into subsequent pages that contain an element with the same id. Element permanence is awesome...
Parsing File Paths As Slash-Delimited Lists In MySQL
I've been working on populating a temporary MySQL database table that contains file paths of files that need to be deleted. And, since deleting data is always terrifying, I wanted to write a validation SQL statement that would take the files in the temporary table and...
Working Code Podcast – Episode 114: Carol Got Laid Off
Amid the frenzy of industry lay-offs, we here at the Working Code podcast were devastated to hear that our very own Carol Weiler has been affected by a down-turning real estate market. A few weeks ago, while attending a virtual All Hands meeting, her Slack account was...
Fluent Theme
In the upcoming version of jqWidgets, we will add a new Fluent Design Theme following the #microsoft Fluent Design system(https://www.microsoft.com/design/fluent/) The post Fluent Theme appeared first on Angular, Vue, React, Web Components, Javascript, HTML5 Widgets....
Using Stimulus To Preload Links On Hover In Hotwire And Lucee CFML
From what I've been reading, when building a Stimulus controller in Hotwire, the key to success is thinking in terms of small, composable behaviors. So, instead of creating a controller that manages an entire View, we should seek to extract aspects of said view that...
Defer Loading Using Permanent Turbo Frames In Hotwire And Lucee CFML
In a Hotwire application, you can use Turbo Frames to "decompose your page" into islands of information. These islands can be replaced dynamically and loaded asynchronously from the parent page. This reduces the amount of information that blocks the main page render....
Extending The Current Request Timeout In ColdFusion / CFML
The request timeout determines how long the current request / CFThread can execute before the request throws a timeout exception. For the most part, this value is either never set (which then uses the default timeout defined in the ColdFusion admin); or, it's set once...
