⚡️ Hotwire dev newsletter - August 2023

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!

I just got back from two weeks in Australia to watch the women’s World Cup. It was the first time my wife and I vacationed without our son since he was born. I almost forgot how much time there is in a day. 😆

Most of my time was spent visiting museums, drinking coffee at local cafés, and wandering around Sydney. But I also managed to sneak in an hour most mornings to work on my book. It’s amazing how productive I can be with limited, focused work blocks.

I’m looking forward to diving back into work and finding my routine. I also need to start preparing for my Rails World talk on Turbo Native!

Speaking of Turbo Native, there’s a lot of content again this month. Both libraries dropped their beta tag and are now official v7.0.0 releases. I’ve also included a link to two videos on getting started with Turbo Android.

Outside of native, we have a bunch of Hotwire tutorials and some big announcements.

Let’s dive in!

📣 Announcements

Rails World 2023 agenda

The Rails Foundation released the full agenda for the upcoming Rails World conference in October. There are 30 speakers split across two tracks. And like I said last month, the list is impressive.

I’m presenting Just Enough Turbo Native to Be Dangerous at 1:30pm on the second day. If you’re going to the conference, I’d love to meet you – come say hi!

Turbo Native v7.0.0 releases - iOS and Android

Yesterday Jay officially released version 7 of the two Turbo Native libraries. Both libraries were “presented in beta form” until today with a heavy disclaimer. Changes are now locked in and ongoing development will follow semantic versioning.

This, plus Strada’s planned release at Rails World, is getting me very excited for the future of Turbo Native.

Rails Hackathon 2023 winners

by Chris Oliver @excid3

The second annual Rails Hackathon wrapped up earlier this month and the three winners were announced. Congratulations to the winning teams and all 37 entries submitted this year. There’s some outstanding work done on these projects, especially considering everything happened over a single weekend.

Stimulus v3.2.2 release

The latest release of Stimulus has a slew of new features, bug fixes, and contributors. Highlights include more flexibility when binding to keyboard events, an additional observer for the Outlet API, and some error messages.

👩‍🏫 Tutorials

Building a real-time user page detector

by Andrea Fomera @afomera

Learn how to use Turbo Streams to show an avatar for everyone who is currently visiting a page. Helpful in making it obvious there might be other folks working on the same thing you’re working on.

Andrea does a great job breaking each step down into concise, easy-to-follow steps. The code snippet on identifying a Devise user in a Turbo Stream is worth the read alone: identified_by :current_user.

You Don’t Need Rails to Start Using Hotwire

by Akshay Khot

This tutorial works through building a static site with a Turbo Frame all the way to a fully-baked Sinatra server with Turbo Streams. Akshay shows that you can slap Turbo (and Hotwire) on top of any web framework.

<script type="module">
  import * as Turbo from 'https://cdn.skypack.dev/@hotwired/turbo';
</script>

Turbo Stream and personalised content

by James Adam

Here’s another approach to identifying the user in a Turbo Stream. Instead of grabbing the Devise cookie in JavaScript, the user’s information is embedded in the DOM. This, combined with a small Stimulus controller, enables some post-broadcast customization of Turbo Streams.

Dependent Dropdowns with Hotwire

by Greg Molnar @GregMolnar

A quick tutorial on how to populate the contents of one dropdown based on the value of another - powered by server logic. Greg wires up a form that submits (automatically via Stimulus!) to set the values of the second dropdown. There’s also some tips on improving the UX, like hiding the button if JavaScript is enabled.

by Chris Oliver @excid3

When a list of navigation links get too long you can render a dropdown on mobile. No matter how many links there are, the <select> tag will always take up the same amount of space.

Chris explains how to build this with an array of items so you don’t duplicate logic. And no Stimulus controller required, the page visit is inlined via onchange!

📱 Turbo Native

App Store submission tips for Turbo Native apps

by Joe Masilotti @joemasilotti

Sometimes the hardest part about building a native app isn’t the coding. It’s getting approved in the App Store.

Here are the App Store Review Guidelines to watch out for when submitting your own Turbo Native app. I’ve built this list up from helping dozens of businesses launch their iOS apps in the Apple App Store.

Up and Running with Turbo Android - part 1 and part 2

by William Kennedy @williamkennedy

Follow along with William as he integrates Turbo Native into a brand new Android app. It’s like a counterpart to my Turbo Native in 15 minutes video. He adds a native tab bar in the first part and handles modals in the second.

I haven’t picked up Android in quite a while… but this is getting me excited. I might have to fire up Android Studio again!

Turbo Native tabs