In this course we start with a traditional Rails app and incrementally apply various aspects of Hotwire to improve the speed and responsiveness of each page.
So let's setup everything you need to run the starter app and follow along with the videos.
1. Download the Code Bundle
All the source code shown in the videos is available in the code bundle.
After unzipping the downloaded file, you'll end up with a directory named
pragstudio-hotwire-code. Inside that top-level directory you'll find the following subdirectories:
starter-appcontains a Rails application in the
fishingsubdirectory. That's our starting point!
snapshotscontains subdirectories matching the course modules. For example, the
04-turbo-drivedirectory contains a snapshot of the application code at the end of the video in Module 4.
final-appcontains the fully-Hotwired
Now that you know your way around the code bundle, let's get things running...
2. Install Ruby
The Rails app requires Ruby 3.0.0 or newer. To check which version you have installed, use:
Up-to-date instructions for installing the latest version of Ruby on any operating system are available at ruby-lang.org.
3. Install Node.js and Yarn
The Rails app also requires Node.js 14 or newer and Yarn. To check which versions you have installed, use:
node -v yarn -v
If you're on a Mac and already using the Homebrew package manager, you can install the latest versions of Node.js and Yarn using:
brew install node yarn
4. Install and Start Redis
Now, the starter app doesn't include real-time features so Redis isn't required to run the starter app. However, you'll need to have a Redis server running on your computer when we get to the broadcasting modules of the course. So we recommend setting up Redis now so it's not something you need to remember to do later. 😀
If you're on a Mac and using the Homebrew package manager, you can install and start the Redis server like so:
brew install redis brew services restart redis
For Linux users, this should do the trick:
sudo apt-get install redis-server sudo service redis-server restart
Windows users will need to install and start the Redis server in a Linux environment using the Windows Subsystem for Linux. Run the following commands in a Linux terminal:
sudo apt-add-repository ppa:redislabs/redis sudo apt-get install redis-server sudo service redis-server restart
5. Fire Up the Starter App
In the next video we'll walk through the pages of the starter app, so go ahead and get it running:
First, change into the
starter-app/fishingdirectory and setup the app:
cd starter-app/fishing ruby bin/setup
And now you're ready to start the Rails server.
On Mac/Linux you can run the following command which uses foreman to start the server and rebuild the JS bundle when necessary:
On Windows you'll need to run the following commands in two separate Terminal sessions:
rails server -p 3000
yarn build:css yarn build --watch
Then if you browse to http://localhost:3000 you should see all the baits. 🎣
If you'd prefer to run the app in a Docker container, we have Docker files to make that easy.
When you hit the big green button below, you'll go directly to the next video. Feel free to follow along with us in the video if you like, and don't be shy about pausing or rewinding to watch something again. After each video you'll find any relevant notes in the aptly-named "Notes" section.
Let's start hotwiring! ⚡️