Lightning Talk: Hotwire Cookbook and common use cases

by Yaroslav Shmarov

In this Lightning Talk presented by Yaroslav Shmarov at the Friendly.rb 2023 conference, the discussion revolves around Hotwire, a framework that allows developers to build rich web applications without the complexity typically associated with modern JavaScript frameworks like React.

Key points covered during the talk include:

- Introduction to Hotwire: Yaroslav introduces himself, sharing his background and experiences. He emphasizes the utility of Hotwire for indie developers, suggesting that it provides sufficient tools for most web applications not focused on mobile.

- Comparison with React: He discusses the current trend of using React in large companies but advocates for Hotwire as a simpler, faster alternative for many projects.

- Ideal Use Cases: Yaroslav distinguishes between scenarios where Hotwire is advantageous, such as in applications like Trello, and where it might fall short, such as in complex applications like Miro or Figma, where real-time features are essential.

- Components of Hotwire: The presentation delves into Hotwire’s components, including Turbo Frames, Turbo Streams, and Stimulus JS, explaining how these can be integrated into both Ruby on Rails and other frameworks like Laravel.

- Live Updates with Turbo Streams: He describes the functionality of Turbo Streams as a means to implement live updates in web applications without requiring page refreshes, which is ideal for features like live chats or notifications.

- Development Experience: Yaroslav highlights the significant improvements in development ease, particularly in creating modals and handling live interactions with Hotwire compared to previous years.

The talk concludes with Yaroslav encouraging attendees to start projects with Hotwire, expressing optimism about its potential for enhancing web development. He invites viewers to explore his YouTube channel on SuperRails for further insights into learning and using Hotwire effectively. Overall, the talk underlines the importance of selecting the right tools for different application needs and promotes the exciting possibilities of Hotwire for developers looking to streamline their workflow.

00:00:05.759 Hello everyone! I'm going to talk a bit about Hotwire. This is me in the picture along with my lovely dog, Cindy. I lived about 78 km from Chernobyl. On the first days of the war, Russia surrounded my hometown. This is a photo of my family's home, and my godfather went to the front lines. There are also Rubyists who are in the conflict right now, such as Zok, who you might know from his contributions to Ruby.

00:00:42.360 On a more positive note, just two months ago, I became a father. I'm doing my best to balance everything, and I've got a YouTube channel where I discuss a variety of topics regarding Ruby on Rails, with a special focus on Hotwire.

00:01:04.159 We've already had talks about how we don't need React; we can build applications with scaffolding alone. However, I found a recent discussion about GitHub's changes to be quite depressing. Many of the people I've spoken to work with React at larger companies, which have hundreds of developers. But when it comes to indie hacking, you often don’t need React at all. You can build everything you need with Hotwire, which allows for faster development.

00:01:58.719 Hotwire is sufficient for most web applications that aren't mobile-first unless you need a real mobile app. If your users are business users, they usually access your application from desktops rather than their phones. There are different tools for different jobs, and it's crucial to use the right one.

00:02:31.000 For instance, if you’re building something complex like Miro or Figma, it may not be ideal to use Hotwire. On the other hand, if you're creating something like Trello, you can easily build snappy drag-and-drop interfaces using Hotwire.

00:02:56.280 Hotwire is capable of handling reactivity in applications like Twitch. You can separate different components, like streaming broadcasts, into frames, which keeps everything modular. For instance, if you're developing a significant app like Amazon, utilizing frameworks like Hotwire might not be necessary since there are no real-time features involved in that context.

00:03:43.320 Now, let’s talk about Hotwire's components. It includes Turbo Frames, Turbo Streams, and Stimulus JS. One of the cool things about Hotwire is that it can function independently of Ruby on Rails. You can use it with various front-end frameworks like Laravel, which shows its versatility.

00:04:43.680 Turbo Streams, for example, are a rebranding of js.erb and allow for live updates without page refreshes. This is particularly useful for live chats or any feature that requires dynamic interaction. Each element can load individually as needed, which minimizes initial loading times and optimizes performance.

00:05:43.800 Building modal windows with Ruby on Rails has become incredibly straightforward; you don't need additional JavaScript anymore. If you compare tutorials from five years ago to now, you'll see significant improvements in how we handle these features.

00:06:54.800 Hotwire can enhance live streaming functionalities, with each component operating as an independent element. Features like live chat also function effectively with Turbo Streams, enabling real-time interactions without the need for page reloads. You can send flash messages, notifications, and other updates seamlessly.

00:08:25.240 If you're interested in learning more about Hotwire, I encourage you to check out my playlist on SuperRails. I strongly recommend starting a small project using Hotwire—it's an exciting development experience. Thank you for your attention, and I look forward to the next talk!