(This post is part of my “from scratch” AngularJS project. If you are feeling lost, the first post is here.)

I’m not going to lie, I thought this was going to be a GREAT post! So much information about how to deploy our site to github pages and make it available for the world. The good news is, we did all the hard work in our previous post. The bad news is, this will probably be the shortest post and commit in this series.

Github Pages

Github gives us the ability to host our projects on their servers via github pages. Basically, whatever we put in a gh-pages branch, will go into a publicly hosted page.

https://help.github.com/articles/creating-project-pages-manually/

Gulp

Ok, so how do we get our project into that gh-pages branch? Enter, our good friend, gulp. Sure, we could build our files, checkout the branch and manually commit our build folder to the branch, and push to github. OR, we can make use of someone else’s hard work! We can use this tool as a plugin to our gulp tasks.

npm install gulp-gh-pages --save-dev

Then, simply pipe the result of our build to the plugin and it will do the rest! We just need to add these lines to gulpfile.js.

var ghPages = require('gulp-gh-pages');

gulp.task('deploy', ['build'], function(){
return gulp.src('./build/**/*')
.pipe(ghPages());
});

Now we can just run gulp deploy and our site is live! Thanks to our hard work in creating the build task, we are all ready to go.

Running the code gives us a deployed version of our blackjack game! If you haven’t been following along and running every blog post locally, you can now play the game here!

The code for everything up to this post is available here..