Toggle sidebar

Previous: Targeting Elements with Turbo Streams

All books ▸ Hotwire Handbook ▸ Let's Build a To-Do List with Hotwire

Let's Build a To-Do List with Hotwire

Hotwire Handbook

Introduction to Hotwire

Traditional Web Architecture

Single Page Applications

What is Hotwire?

Turbo Frames vs. Turbo Streams

You Don't Need Rails to Start Using Hotwire

Using HTTP Server for Static Pages

Installing Turbo

Faster Navigation with Turbo Drive

Dynamic Page Updates with Turbo Frames

Setup for Turbo Streams

Targeting Elements with Turbo Streams

Let's Build a To-Do List with Hotwire

Step 1: Create a New Rails App

Step 2: Install Tailwind CSS

Step 3: Create the Task Resource

Step 4: Setup the Home Page

Step 5: Create New Tasks

Wait, Where's Hotwire?

Step 6: Using Stimulus for Completing Tasks

Step 7: Edit and Delete Tasks

Step 8: Using Turbo Frames for In-Place Edits

Progressive Application Development with Hotwire

Step 1: Setting up the Rails App

Step 2: Setting a Route to Show the Habit

Step 3: Create a Controller and Action

Step 4: Create a View to Render the Habit

Building with Turbo Drive

Enhancing with Turbo Frames

Finishing Touches with Turbo Streams

Next: Introduction