⚡️ Hotwire dev newsletter - September 2021 edition
A curated, monthly roundup of the best Turbo (Native), Stimulus, and Strada articles, code, courses, and more by Joe Masilotti.
Welcome back to the ⚡️ Hotwire dev newsletter! Big news from DHH Friday: the first official release of Hotwire 1.0 is live. That, plus a ton of Stimulus content, a few videos on Hotwire, and a link to a huge list of open source Hotwire apps - all in this edition.
🎉 Hotwire 1.0
DHH announces Hotwire 1.0
Official releases of Stimulus 3 and Turbo 7 make up Hotwire 1.0. Updates to Stimulus include the Values and CSS Classes API. 3.0 brings the ability to pass action method params. This means you can set an “integer” data item and Stimulus will automatically parse it - reducing the need for even more custom JavaScript.
📙 Stimulus
Writing better StimulusJS controllers
by Matt Swanson @_swanson
In summary, use general-purpose controllers as much as possible. First start off by wrapping an onClick function and then create “behaviors that you can use to quickly build out interactive sprinkles throughout your app.” Matt includes a few practical examples, including filtering a list of results.
Disable-With Using StimulusJS
by Jacob Daddario @JacobDaddario
With Rails 7 (officially in beta!), Rails UJS is slowly starting to get phased out. And with that, automatically disabling forms on submit. Jacob walks through how to replicate this behavior with a single Stimulus controller and hints at some potential areas for improvement.
Dynamic Dialogs with Hotwire and Minimal Javascript
by Mike Wilson @mikew1o1
If you don’t want to reach for a third-party library just for modals, this is a great tutorial on building them from scratch. It adds all the expected behaviors, including pressing ESC to close the modal. The only thing missing is proper accessibility markup.
📹 Videos
Dynamic Select Fields in Rails with Hotwire
by Chris Oliver @excid3
A new GoRails video on how to dynamically update fields when a select box value is changed. In this example, when a country is selected a second select box’s options are populated with the country’s states.
Stimulus, Hotwire, Bootstrap 5, Rails 6 tutorial video
by Phil Smy @psmy
Bootstrap - what a nice break from Tailwind CSS! In this episode of Real Life Rails, Phil walks through a fresh Rails 6 install and demonstrates how to display a duration via a Stimulus controller and Hotwire-powered dynamic content.
Hotwire Turbo Replacing Rails UJS
by Dave Kimura @kobaltz
In this episode of Drifting Ruby, Dave dives into the functionality that we got with Rails UJS and what it looks like to reimplement these with Turbo and Stimulus, like confirmation dialogs.
⚡️ Hotwire in action
List of Hotwire and ReactiveRails applications
by Amirul Asyraf @asyr0f
A huge GitHub repository for all things Hotwire and ReactiveRails. The list includes open source applications, demo apps, tutorials, and even Hotwire in non-Rails environments.
Five Turbo Lessons I Learned the Hard Way
by David Eisinger @deisinger
A few gotchas David has picked up when working on a client project with Turbo. Two that jump out to me are sending a 422 status code to re-render a form with errors and a way to trigger a Turbo form submission via JavaScript.
👩💻👨💻 Jobs
Hire Justin Zimmerman
Self Taught junior dev, making a career change from sales. “Give me an internet connection, a little bit of time, and I will change the world.” Archimedes
Hire Thomas Imfiny
Ruby dev with 7+ years of experience on Rails apps, tooling and infrastructure. Available as fractional engineering leader 2 to 4 days a week, strong taste for pairing, learning and helping others level up.
Hire David Blackwelder
Army veteran, professional magician, sales leader, bootcamp grad, and a chess player looking to build an awesome product through writing software using Ruby on Rails. I am hungry for my first rails role.
Hire Feti Jashari
Senior Software Developer specializing in SaaS Apps, ERPs, CRMs, APIs including Payments, Analytics etc. Former Startup Founder & CTO at Tanisales.com, Expert on JumpstartRails and Hatchbox.
