Deploying to Github Pages With Grunt

Share on FacebookShare on Google+Tweet about this on TwitterShare on Reddit

As my previous posts have discussed, I’m currently building an isometric city simulator.  As I post screenshots to Twitter and tell my friends about it, they inevitably want to see it in action.  I have web hosting here at Evil Mouse Studios, but if I want to put my project online here, it requires uploading all the files manually and it’s kind of a pain.

Enter Github Pages.  Github offers a service called Github Pages that hosts a running version of your project for you.  All you have to do is branch off of your project, call it “gh-pages”, and then you can see your site online.

I use Grunt to automate my build process, and it works great.  It takes all the files I need to run my game and copies them (after processing) to my dist folder (where the game is run from). For my game to work successfully, the entire “dist” folder needs to be hosted somewhere.  This normally wouldn’t be a problem, but “dist” isn’t stored under version control.  It’s the built version of my game, and having it on Github would just be a waste.  So how do I deploy my “dist” folder to Github Pages?

grunt-gh-pages is a package that does exactly that.  You add it into your .gruntfile, and it takes care of the rest.

Here are the steps I took to get it working (I’m assuming you already have grunt installed and working).

1. Install grunt-gh-pages

2. Add it to your .gruntfile

3. Register the task.  I called mine “dev”

4. Run grunt

5. Visit your project on Github Pages

I hope that helps anyone that uses grunt to build their project and would like to utilize the amazing hosting service Github provides.

Leave a Reply

Your email address will not be published. Required fields are marked *