Hotwire

Learn how to use Hotwire as an alternative approach to building modern web applications without using much JavaScript by sending HTML instead of JSON over the wire.

Start Series

24m

19 Lessons | 5h 14m | Intermediate

24m

How to use Hotwire in Rails

Dec 23, 2020

Hotwire is the NEW MAGIC that DHH has been teasing about for so long. This episode we'll build the famous Twitter clone using Hotwire to see how it compares to other solutions out there.

11m

How to use Devise with Hotwire & Turbo.js

Jan 01, 2021

Hotwire's Turbo library intercepts forms automatically so Devise needs a few tweaks to work with it. Learn how to do that in this screencast!

11m

How to upgrade from Turbolinks to Hotwire & Turbo

Jan 05, 2021

Upgrading from Turbolinks to Hotwire is actually pretty simple now that Turbo handles error responses

Hotwire Modal Forms

Jan 12, 2021 Pro

Modal forms are common, but how do we do them with Hotwire to render validation errors and redirect on success?

11m

Flash Messages and Toasts with Hotwire & Turbo.js

Mar 15, 2021 Pro

Hotwire & Turbo.js are designed to make realtime updates to your page. So how do you notify the user with flash messages or toasts? That's what we're covering in this episode.

19m

Dynamic Select Fields in Rails with Hotwire

Aug 02, 2021

Need to dynamically update fields when a user changes a select box? We can do that easily in Rails using Hotwire's Turbo Stream actions.

25m

Datatables From Scratch Using Hotwire

Nov 22, 2021 Pro

Ever wanted to build Datatables into your Rails app? You can using Hotwire using Turbo Frames without any custom Javascript.

12m

Migrating from Rails UJS to Hotwire: Data Method, Confirm, and Disable With

Dec 29, 2021

Turbo now provides equivalents to Rails UJS data confirm, disable with, and method attributes that we can use.

13m

Realtime Charts with Stimulus Target Callbacks

Jan 17, 2022 Pro

Learn how to use Stimulus Target Callbacks to trigger realtime Chart updates

20m

Inline Editing with Turbo Frames in Rails

Feb 01, 2022

Hotwire allows us to add inline editing easily in Rails forms using Turbo Frames. Learn how to implement them in a reusable manner so you can inline edit any fields across any model.

Custom Turbo Confirm Modals with Hotwire in Rails

Jun 13, 2022

Overriding the Confirm method in Turbolinks and Hotwire has been pretty tricky until now. Using promises, Turbo can now wait until the user has submitted the confirm modal.

31m

Dynamic Nested Forms with Turbo

Nov 28, 2022 Pro

In this episode, we will look at how to refactor an existing dynamic nested attributes form that uses Stimulus to instead leverage the ability to now make GET requests with Turbo.

15m

Turbo Confirm Modals with Confirmation Text in Rails

Turbo confirm modals typically ask a simple yes or no confirmation. What if you want to force the user to type in confirmation text to ensure they are paying attention? That's exactly what we'll build in this episode!

10m

Auto-submitting Forms & Custom Turbo Stream Actions

Mar 27, 2023

Learn how to auto-submit forms when a user changes a value and use custom Turbo Stream Actions to update the page

15m

Custom Turbo Stream Actions

Apr 03, 2023 Pro

Learn how to build custom Turbo Stream Actions to build things like browser notifications, console logging, or anything you want. Plus, we'll look at how Turbo implements this in their GitHub codebase.

10m

Refactoring Turbo Streams into Turbo Frames

Jul 10, 2023

Turbo Frames provide an iFrame like concept for Hotwire applications. If you're using Turbo streams to replace a portion of the page, you can accomplish the same thing even easier using Turbo Frames

35m

Dynamic Nested Forms With Turbo Part 2

Jul 17, 2023 Pro

In this episode, we will look at an approach to adding the ability to delete / remove the nested fields from our form.

12m

Responsive Navigation with Turbo

Aug 14, 2023

Mobile and desktop versions of widgets often need to be completely different. Navigation and tabs on mobile don't work well when there are lots of items so we'll show you how to use Turbo and a select tag for mobile navs.

12m

Live Reloading with Hotwire Spark

Dec 23, 2024

Hotwire Spark is a new live reloading tool for Hotwire applications that uses morphing to update the page smoothly.

Learning Ruby on Rails? Join our newsletter.

We won't send you spam. Unsubscribe at any time.