⚡️ Hotwire dev newsletter - June 2021 edition

A curated, monthly roundup of the best Turbo (Native), Stimulus, and Strada articles, code, courses, and more by Joe Masilotti.

Welcome to the first edition of the ⚡️ Hotwire dev newsletter and thanks for subscribing! For a quick introduction, I’m Joe Masilotti and I blog about Rails, iOS, and testing on Masilotti.com. I also tweet about how I port Ruby on Rails to mobile apps with Turbo Native.

I’m starting this newsletter with the basics: where to find help/documentation and how to get started with Hotwire. I’m also including a few useful links I’ve been gathering since Hotwire was announced at the beginning of the year.

If you find (or publish!) Hotwire content and would like it included in the next edition then reply to this email. You can also reach out on Twitter.

📄 Documentation and support

Official documentation

Turbo and Stimulus have their fair share of first-party documentation. I recommend reading through the handbooks to get started then diving into the reference docs for specific questions.

Community support

There’s also a fairly active community forum, Hotwire Discussion, where Basecamp employees are known to answer questions. On May 9, DHH mentioned that Basecamp will continue Hotwire development after a short break to regroup.

Basecamp will continue its development and patronage of Hotwire. We are taking a break to regroup, then will be back at it in a bit, working with whoever is interested in collaborating on the project.

As expected with open source projects, GitHub issues are still a great place to get answers to specific questions. StackOverflow doesn’t have a tag for Hotwire yet, but you can ususally find what you need via #turbo and #stimulusjs. Helping organize these tags is an opportunity to gain some SO karma!

💎 Hotwire and Rails

Hotwire Rails

by GoRails @GoRails

Chris from GoRails published 5 GoRails videos introducing Hotwire to your Ruby on Rails application. He covers Turbo in a fresh Rails 6 app and converting from Turbolinks to Turbo in an existing one. He also dives into integrating Devise with Turbo. If you’re a Pro subscriber, make sure to check out flash messages and modals with Hotwire.

Turbo Frames, Sidebar Layout, and Details Page

by Tony Messias @tonysmdev

Tony makes use of Permanent Elements to to make sure a sidebar persists between page requests. There’s example HTML markup and Alpine.js JavaScript which can easily be converted to Stimulus.

Making Hotwire play nice with ViewComponent

by Kudakwashe Paradzayi @kudapara

If you’re upgrading your partials to view components then this article is definitely worth a read. Partials and Hotwire don’t play nicely out of the box, but Kudakwashe offers a reusable solution to help, LiveComponent.

Infinitely Scrolling Lists with Hotwire and Zero JavaScript

by Lewis Youl @lewisyoul

Powered by a Turbo Frame, there’s surprisingly little code needed to get this working thanks to a (new to me) option, loading: :lazy. Lewis walks through the entire process: from Rails scaffold to infinite scroll.

Lazy-loading content with Turbo Frames and skeleton loader

by Matt Swanson @_swanson

Matt builds a lazy loading frame that mimics GitHub’s activity screen. Usually, this approach ends up being a bit jumpy - content moves around once it loads. He remedies this with a skeleton loader, or skeleton screen.

📱 Turbo Native (iOS)

Hybrid iOS apps with Turbo

by Joe Masilotti (me!) @joemasilotti

A 6-part series by yours truly on how to port your Ruby on Rails app to a hybrid iOS app. Covering authentication, the JavaScript bridge, native screens, and more.

Confirm dialogs in iOS webviews using Turbo

by Bram Jetten @BramJetten

Out of the box, Turbo iOS doesn’t support alerts and confirm dialogs. Bram goes through a few lines of Swift to add this native functionality to your hybrid app.

🤷 Where’s Strada?

When Hotwire was announced earlier this year we were promised that “Strada will premiere in 2021.” Sadly, with all that’s happened at Basecamp recently, Strada seems to be delayed.

If anyone has any information or insights on where Strada is, or what it might be, please let me know! You can reply to this email or reach out on Twitter.

My guess is that it will simplify interaction between Turbo Native clients and the web JavaScript. Maybe HTML markup powered by data-attributes to streamline the JavaScript bridge a bit more than the current 4 step process.

Thanks,
Joe Masilotti
@joemasilotti joe@masilotti.com