⚡️ Hotwire dev newsletter - June 2022 edition
A curated, monthly roundup of the best Turbo (Native), Stimulus, and Strada articles, code, courses, and more by Joe Masilotti.
It’s been an entire year since the first edition of the newsletter went out last June! I can’t believe we’ve grown from 200 to almost 2000 Hotwire developers in only a year.
To celebrate, I’ve recapped the most popular articles of the past year. But first, let’s see what the Hotwire community has been up to.
First up, Rails and Hotwire have their own official Discord channels! They are geared towards helping contributors and not general support forums. But if you’re interested in contributing I recommend joining and saying hi.
📹 Videos
Build an Instagram clone With Hotwire
by Cezar Halmagean (Mix & Go) @chalmagean
The Mix & Go YouTube channel is back with another 5-ish minute video. This time, we’re building an Instagram clone. Follow along and learn how to implement photo posting, commenting, and even liking. All powered by Rails and Hotwire.
Rails 7 upgrade livestream
by Sundae Club
Dive deep into a Rails 7 upgrade in this live stream from Sundae Club. This video covers ripping out webpack and replacing it with a few alternatives. Subscribe to their channel for weekly live streams on, you guessed it, Sundays.
How to build a calculator with Hotwire and no JavaScript
by Cezar Halmagean (Mix & Go) @chalmagean
A great concept because it’s so easy to picture in our heads: a calculator. This tutorial codes all of the math logic in Ruby and steps back as Hotwire updates the HTML.
🎓 Tutorials and guides
A11y on Rails
by Monica Mateiu @a11yonrails
A deep dive into some changes you can apply to your Rails app to improve a11y (accessibility). My favorite, and new to me, is adding aria-live="polite"
to flash messages so assistive technology can announce them correctly.
Tailwind style CSS transitions with StimulusJS
by Matt Swanson @_swanson
Matt levels up our UI designs by adding smooth animations to transition elements. Classic example? Showing and hiding a menu. This is a great place to start if you use Tailwind UI, too!
Building a chat with Hanami and Hotwire
by Paweł Świątkowski @katafrakt_pl
I share a lot of Rails content in this newsletter. So I’m excited to give our friends working with Hanami some love! Follow along as Paweł builds a chat app from scratch, including a link to the full source code.
📈 Most popular links from the last year
Hotwire Handbook
by Phil Reynolds @PurpleRiver_Dev
A living document on practical examples and how to accomplish them with Hotwire. So far, toggle buttons, content updates, and live counters are covered. Upcoming features include pagination, inline editing, and (what I’m looking forward to the most) tabbed content. And Part 2 dropped a few days ago!
Hotwire in the real world.
by Finnian Anderson @developius
A deep dive into the architecture decisions, pitfalls, and wins of using Hotwire in non-trivial production application. I especially love the section on how important authorization is with Turbo Streams. Finnian recommends using Pundit and covers how they are using it in their app.
Hotwire::Livereload
by irill Platonov @kirplatonov
Automatically reload the page when “view” files are modified, like HTML, CSS, helpers, and JavaScript. Can also be configured to listen to any path, like view components.
The Stimulus Trigger Pattern
by Jose Farias @fariastweets
A pragmatic and practical approach to a common problem with Hotwire: how do I submit a HTTP request after a Turbo Stream is rendered? Jose walks through how they built a shared space for two entities to communicate with each other, powered by Hotwire and some Liquid templating.
User notifications with Rails, Noticed, and Hotwire
by David Colby @davidcolbyatx
This tutorial starts with an empty Rails 7 project then adds on a Turbo Frame, creates a Noticed notification, wires up ActionCable, and finally subscribes to the stream via Hotwire. It’s everything you need to set up a live-updating notification drawer in your Rails app.
🎉 Product market fit achieved
RailsDevs placed a developer! This is a huge milestone because it marks the first full-time hire made via the platform.
On top of this, there are a handful of open offer letters waiting to be accepted. If you’re looking for your next Rails job then this is a great time to add your profile.
It’s official. RailsDevs has officially placed a Rails developer for a full-time role!
— Joe Masilotti 📗 (@joemasilotti) June 16, 2022
Here’s that endorphin boost from Stripe for the 10% hiring fee. pic.twitter.com/HVv3rGqpXM
