Week 02 - Hotwire Native book, Skeleton Frames, and more!
This edition covers autosaving forms, dynamic widgets, image uploads, and Hotwire Native updates!
Welcome to Hotwire Weekly!
Welcome to another issue of Hotwire Weekly! Happy reading! 🚀✨
📚 Articles, Tutorials, and Videos
Auto-saving Rails forms with Turbo Streams - Josef Strzibny demonstrates how to implement an autosave feature for inline input fields using Turbo and Stimulus.
A Simple Fix for Dynamicly Added External Widgets in Turbo-Enabled Sites - Maciej Litwiniuk addresses the issue of external widgets, such as Chatwoot, disappearing or reloading during page transitions in Turbo Drive-enabled sites.
Image Uploads with Uppy & ActiveStorage in Rails - Ken Greeff integrates the Uppy package with ActiveStorage in a Rails application to add image upload functionality for listings and places. This tutorial is part of a series on building a luxury accommodation directory using Rails, Hotwire, ViewComponents, and Stimulus, showcasing modern Rails development practices.
Use cases for Turbo's Custom Events - Rails Designer explores practical applications of Turbo custom events to enhance user experience in Rails applications.
Drifting Ruby: Skeleton Frames - Dave Kimura demonstrates how to implement temporary loaders for Turbo Frames in Rails applications. These loaders, known as skeleton frames, provide users with visual feedback during data loading, by displaying placeholder content until the actual data is rendered.
Dynamic Charts Using D3 Steaming New Data to Chart via Turbo - Tomas Valent published a video explaining how to stream new data from a background job to a D3 chart in the frontend using Turbo and Stimulus.
The future of htmx - The htmx team highlights focus on simplicity, server-driven interactions, and HTML as a primary medium for building dynamic web apps. These principles closely align with Hotwire’s approach, emphasizing minimal JavaScript, progressive enhancement, and efficient, server-first development.
Make delete actions stand out in Hotwire Native menus - Dennis Paagman explains how to enhance the native feel of Hotwire Native apps by distinguishing destructive actions, such as deletions, within native menus.
Up and Running with Hotwire Native Android Part 3 - Native Screens - William Kennedy shows how to render native screens within a Hotwire Android application.
Hotwire Native book, in beta! - Joe Masilotti's "Hotwire Native for Rails Developers" book is now available for purchase on The Pragmatic Programmers.
🧰 Libraries and Tools
data-star - The hypermedia framework for building reactive web applications with the simplicity of server-side rendering and the power of a full-stack SPA framework.
inertia-rails - The Rails adapter for Inertia.js.
🎉 Releases
hotwire-native-ios v1.1.1 - Hotwire Native for iOS.
hotwire-native-android v1.1.1 - Hotwire Native for Android.
stimulus-bridge v3.2.3 - Stimulus integration bridge for Symfony projects.
actioncable-next v0.1.2 - Next-gen version of Action Cable.
tailwindcss-rails v3.2.0 - Integrate Tailwind CSS with the asset pipeline in Rails.
tailwindcss-ruby v4.0.0.beta.9 - A self-contained tailwindcss executable, wrapped up in a ruby gem.
Feel free to follow us on Twitter/X, Bluesky, or on Mastodon!
See you next week!