Home/Courses/Ruby on rails/Modern Rails Frontend with Hotwire

Modern Rails Frontend with Hotwire⚡

Intermediate→Advanced

Rails 8.1

Master Hotwire, Rails' modern approach to building interactive web applications. Learn Turbo Drive for fast navigation, Turbo Frames for partial page updates, Turbo Streams for real-time broadcasts, and Stimulus for JavaScript sprinkles. Build rich user experiences with minimal JavaScript.

6

Sections

18

Lessons

21

Challenges

Start this free course

Start learning Modern Rails Frontend with Hotwire

18 lessons and 21 challenges, all 100% free.

Start this course

Understanding Import Maps

Managing Dependencies with Import Maps

Import Maps Concepts(Sign in required)

Beginner+10 Mana

Stimulus Setup with Import Maps

Pinning a Package(Sign in required)

Beginner+10 Mana

Creating a Stimulus Controller(Sign in required)

Intermediate+20 Mana

What Is Hotwire

Turbo Drive Basics

Hotwire Component Roles(Sign in required)

Beginner+10 Mana

Forms with Turbo Drive

Turbo Form Status Codes(Sign in required)

Beginner+10 Mana

Hotwire Stack Components(Sign in required)

Intermediate+20 Mana

The Turbo Frame Tag

Lazy Loading with Turbo Frames

Frame ID Matching(Sign in required)

Beginner+10 Mana

Frame Navigation and Targeting

Lazy Loading Syntax(Sign in required)

Beginner+10 Mana

Building a Tabbed Interface(Sign in required)

Intermediate+20 Mana

Frame Scoping Behavior(Sign in required)

Intermediate+20 Mana

Turbo Stream Actions

Broadcasting with Action Cable

Stream Actions(Sign in required)

Intermediate+20 Mana

Turbo Stream Responses

Stream Action Count(Sign in required)

Intermediate+20 Mana

Broadcast Setup(Sign in required)

Intermediate+20 Mana

Turbo Stream Features(Sign in required)

Intermediate+20 Mana

Controller Lifecycle

Targets and Values

Lifecycle Callbacks(Sign in required)

Beginner+10 Mana

Actions and Events

Action Descriptor Syntax(Sign in required)

Beginner+10 Mana

Wiring Up Stimulus(Sign in required)

Intermediate+20 Mana

Combining Frames and Streams

Stimulus and Turbo Integration

Hotwire Pattern Selection(Sign in required)

Intermediate+20 Mana

Building Real-Time Features

Real-Time Features(Sign in required)

Intermediate+20 Mana

Turbo Stream Action Types(Sign in required)

Advanced+30 Mana

Turbo 8 Morphing(Sign in required)

Advanced+30 Mana

Ready to start this free course?

No credit card required.

Start this course now

Ready to start Modern Rails Frontend with Hotwire?

18 interactive lessons and 21 hands-on challenges — learn in VS Code, Cursor, or the web.