MARCUS ÖSTERBERG

live reload using Jekyll

Jekyll LiveReload Guard

Hi, and welcome to my first blog post. This site is built using the static site generator Jekyll. How to get started with Jekyll is simple, and I could not describe the process better then Jekyll own documentation.

I like to automate as much as possible in my life, before I started building this project I figured out How to get live reload to work with Jekyll and it’s very easy.

I assume you have Jekyll installed by now.

Step 1. Open up your Terminal and install the following Gems:

~$ gem install guard
~$ gem install guard-jekyll-plus
~$ gem install guard-livereload

Step 2. Init guard in your project folder

~$ guard init

Step 3. Open up guardfile and add the following lines

guard 'jekyll-plus', :serve => true do
  watch /.*/
  ignore /^_site/
end

guard 'livereload' do
  watch /.*/
end

Step 4. Now you need to install live reload extension for your prefered browser (I’m using LiveReload for chrome)

Step 5. Now run guard in your project folder.

~$ guard

This will start the Jekyll server and wait for a browser with live reload capability to connect. You should now see in your terminal that you are connected or waiting for connection and some details about your web server configuration.
Five steps later and you are an automated robot

If this guide mastered your workflow or destroyed your computer, drop a comment below.
Enjoy your code.


comments powered by Disqus
Archive