Week 50 - Turbo morphing woes, 10 Hotwire Native tips, and more!
Keeping Rails cool with modern tools, mastering Turbo frame refreshes, and diving into Hotwire Native tips and Stimulus tricks.
Welcome to Hotwire Weekly!
Welcome to another issue of Hotwire Weekly! Happy reading! 🚀✨
📚 Articles, Tutorials, and Videos
Keeping Rails cool: the modern frontend toolkit - Irina Nazarova wrote an article on the Evil Martians blog and presents a comprehensive guide for startups using Rails, focusing on enhancing frontend development productivity. They advocate for integrating tools like Hotwire and Inertia.js to streamline development and improve user experience.
10 tips from 10 years of Hotwire Native - Joe Masilotti shares insights from a decade of experience with Hotwire Native (formerly Turbo Native and Turbolinks).
Turbo morphing woes - Matheus Richard discusses challenges encountered when using Turbo's morphing feature in Rails applications on the thoughtbot blog. Particularly its impact on JavaScript components like rich text editors. He illustrates how morphing can disrupt JavaScript state, leading to issues such as disappearing editor toolbars.
Refresh a single Turbo frame - Fabien Loup addresses the challenge of reloading specific sections of a webpage without triggering a full page refresh in Rails applications using Turbo. He critiques the native refresh action for being too broad, as it reloads the entire page, which can be inefficient and may disrupt the state of Stimulus controllers.
Always use flex-wrap: wrap on flex containers - Stephen Margheim emphasizes the importance of applying the flex-wrap: wrap property to flex containers in responsive web design. He illustrates how neglecting this property can lead to UI elements becoming cramped on smaller screens, using a real-world example from his project, sqlite.directory.
Everything You Need to Ace PWAs in Rails — Turn your Rails app into an engaging native-like application in a couple of minutes - Edigleysson Silva on the Codeminer42 Blog begins a series on transforming Rails applications into Progressive Web Apps (PWAs). He demonstrates how to make a Rails app installable by enabling the manifest.json and configuring routes, allowing users to add the app to their devices.
Hotwire Club: Faceted Search with Stimulus and Turbo Frames - Julian Rubisch published a new challange for The Hotwire Club about Faceted Searches using Stimulus and Turbo Frames.
🧰 Libraries and Tools
stimulus-components - Over 25 Stimulus controllers with built-in behavior. It just got a new website!
tailwindcss-stimulus-components - A set of Stimulus components for TailwindCSS apps.
🎉 Releases
turbo-laravel v2.2.0 - Turbo for Laravel.
stimulus-use v0.52.3 - A collection of composable behaviors for your Stimulus Controllers
stimulus_reflex v3.5.3 - Build reactive applications with the Rails tooling you already know and love.
cable_ready v5.0.6 - Use simple commands on the server to control client browsers in real-time.
turbo_power v0.7.1 - Custom Actions power-pack for Turbo Streams.
turbo_power-rails v0.7.0 - Custom Actions power-pack for Turbo Streams.
anycable-rails v1.5.5 - AnyCable integration for Rails.
symfony/ux v2.22.1 - A JavaScript ecosystem for Symfony built on top of Stimulus.
hot-glue v0.6.9 - Simple, plug & play Rails scaffold building companion for Turbo-Rails and Hotwire.
Feel free to follow us on Twitter/X, Bluesky, or on Mastodon!
See you next week!