Configure LiveReload on Rails 6

zilton7

Zil Norvilis

Posted on October 10, 2021

Configure LiveReload on Rails 6

Alt Text
Very often I find myself tired needing to manually refresh my browser after every little change I do to my code. It is not too hard to do it, but sometimes it is just so annoying.
In such cases I like setting up Rails app preview auto re-loadable. It's pretty easy to do and only takes 5 steps:

First off, let's install a couple of gems into development environment, since live-reloading doesn't even make sense on production.

STEP 1: Add the following to your Gemfile:

gem 'guard-livereload'
gem 'rack-livereload'
Enter fullscreen mode Exit fullscreen mode

and run 'bundle install'.

Alternatively, you can run these commands from within your terminal to install the necessary gems

bundle add 'guard-livereload'
bundle add 'rack-livereload'
Enter fullscreen mode Exit fullscreen mode

STEP 2: Next, we need to initialize livereload, by running:

bundle exec guard init livereload
Enter fullscreen mode Exit fullscreen mode

STEP 3: Now add the following line to the very end of file enviroments/development.rb

config.middleware.insert_after ActionDispatch::Static, Rack::LiveReload
Enter fullscreen mode Exit fullscreen mode

STEP 4: Now you can run the command to start the livereload guard. Keep it running alongside your puma server.

bundle exec guard
Enter fullscreen mode Exit fullscreen mode

PS. You may need to restart your Puma server before livereloading starts working.

STEP 5: install 'LiveReload' extension on your browser.

In order to start your autoreloading preview do this:
start your Puma Server

rails start
Enter fullscreen mode Exit fullscreen mode

start your autoreload guard

bundle exec guard
Enter fullscreen mode Exit fullscreen mode

Make sure to do so in the browser with LiveReload extension running.

That's pretty much it. Now every time you save your code-base file it'll auto reload your browser tab.

You may also watch the video about it on my YouTube channel:

💖 💪 🙅 🚩
zilton7
Zil Norvilis

Posted on October 10, 2021

Join Our Newsletter. No Spam, Only the good stuff.

Sign up to receive the latest update from our blog.

Related

Configure LiveReload on Rails 6
rails Configure LiveReload on Rails 6

October 10, 2021