Learning Rails part 2: Guard yourself

After working a few days on my project in Rails I learned something. Having to work with the terminal to execute commands against your Rails project is nice, since you can do some crazy stuff. It’s also the most annoying thing ever.

I like to live preview my work on the UI. Which means that I have a terminal running the rails server. Because that terminal is running the rails server, I need another one to execute all the other stuff to get new controllers, views, specs, features, etc. I’m okay running two terminals, but there’s a probably a better way.

In this post I will show you how you can supercharge your dev work with Guard. A ruby gem that enables you to automatically run tests, restart the rails server when changes to the config happen and even refresh the current page in the browser when it changes.

How this series work

There’s basically two approaches to learning a new language or thing. You can read a book about it and then start working with it. Or you dive in head-first and start building something and read books afterwards.

Depending on your personality, you may or may not like my style of learning. I am a hacker and I can only learn things inside-out when I get my fingers on them and break stuff

You have been warned! I will not explain theory in these blogposts, just some nice ways of doing things. I will point you to other blogs and manuals, but you will have to read them yourself if you are into such things.

What is Guard?

Guard is a Ruby gem that is basically a filesystem watcher and task runner combination. It can watch a specific directory and execute tasks when certain files change.

The Guard gem uses several other gems to make things functional. There are a number of plugins available that are particularly useful:

• Guard-Rails – Plugin for restarting the rails server
• Guard-RSpec – Automatic RSpec test execution
• Guard-Cucumber – Automatic cucumber test execution
• Guard-Livereload – Live page reloading

There’s a lot more out there, but these are the ones that I liked the most for what I’m doing.

Setting up Guard

Before I dive into the goodness that the plugins offer, let’s take a moment to set up Guard in your project.

Rails projects use a gemfile to setup all the dependencies for developing the application. To set up Guard you need to modify this file and add the following group of dependencies:

group :development do
    gem 'guard'
end

This sets up a new group of gems that are only valid when you’re working on your development computer. The gems in this group are not loaded when running on production machines or even test machines. Within the group you see the Guard gem.

After you have added these lines to the gemfile, save it and run the command on the terminal (in your project directory of course)

bundle install

This will update all the gems required by the project. Bundler will go up to the internet and fetch stuff that’s missing. Gems that have been previously installed, will be used as is. The install command is basically a get-latest from source control, but better.

After you have updated your bundled gems, you need to initialize guard for the first time.

bundle exec guard init

The guard init command generates a new Guardfile in your project directory that will hold the configuration for the plugins that you’re going to add later on.

This will ask the bundler gem to execute the guard command with the install argument. By executing Guard with bundle exec you automatically get all the dependencies mentioned in your gemfile. Saves you a lot of require statements in your ruby files

To run Guard you need to execute the following command on the terminal:

bundle exec guard

Once you execute the command, Guard will start and do nothing. Because there’s no guard plugin loaded and your Guardfile is empty.

Automatically restart your rails server

With Guard set up, let’s jump into the various plugins. The first one that I like to show you is the rails plugin.

The Rails plugin will automatically start the rails development server when you start Guard and watches the configuration of your project. When the configuration changes, Guard will capture it and restart your rails server.

To set up the plugin, you need to kill Guard with Ctrl+C and add the ‘guard-rails’ gem to your gemfile. If you followed the examples earlier, your gemfile will look like this:

group :development do
    gem 'guard'
    gem 'guard-rails'
end

Run the bundle install command to update your gems. After updating your gems, execute the following command on the terminal:

bundle exec guard init rails 

This will set up your Guardfile for the rails plugin. If you run Guard now, it will automatically start your rails server. You can test the plugin, by changing the routes.rb file and saving it. Watch the terminal and you will see after 1 second that your rails server is automatically restarted.

Pretty handy. It saved me a lot of Ctrl+C, Arrow-Up, Enter actions while developing my app.

Livereload your pages

Another cool thing that Guard offers is a plugin that automatically reloads the page you’re working on when it changes.

The live reload plugin uses two components. The first part is the guard plugin. The second part is a browser plugin that talks to the guard plugin on your computer.

For this plugin you need to modify your gemfile to look like this:

group :development do
    gem 'guard'
    gem 'guard-rails'
    gem 'guard-livereload'
end

Run bundle install again to update your gems. After you’ve updated your gems, run the following command to install the live reload configuration:

bundle exec guard init live reload

Restart Guard to reload the configuration and activate the live reload plugin.

For the live reload plugin to fully work, you need to install a browser plugin. You can find them here:

http://feedback.livereload.com/knowledgebase/articles/86242-how-do-i-install-and-use-the-browser-extensions-

Or even better, get the Rack-livereload gem to work with other browsers that don’t support the plugin: https://github.com/johnbintz/rack-livereload

Now if you change a view in your project, the browser will automatically reload the page. Very useful when you’re experimenting with the layout of a page. It’s also useful when you’re changing CSS/SASS or Javascript. Because it will reload the page for those changes too.

The other plugins

The other plugins I mentioned work in the same way as the livereload and the rails plugin. I’m not going to explain them fully, but if you search for them on Github you will find that there’s some great documentation to get you started.

Not in the mood to try it out right now? Don’t worry, I will get back to the other plugins in my next blogpost on testing rails apps.