Using Git to Deploy Static Websites

After learning to use a version control system such as Git, its hard to imagine a time when a version control system wasn’t part of your workflow. Git especially, is very lightweight, extremely flexible and even comes with a whole suite of GUI-based tools as well.

My homepage is actually a static page, built mostly using bootstrap as the css framework, and a sprinkling of php in the middle. Its fairly simple, so I don’t really need any complicated deployment procedures. For a while, I would manually copy the files over to my remote server, after finishing my edits locally.

My laziness as a person has grown over the time as I’ve dug deeper and deeper into the software development hole, so I quickly grew tired of having to manually sync things to my web host. I initially thought of throwing a quick script with rsync, but then I ran across instructions on how to deploy a simple website using git.

I’m using essentially the same workflow for both my main website and my Jekyll blog. If you’re used to the git workflow integration with for example, Heroku, you’ll feel quite at home here. In summary, the idea is to add a post-receive hook into your remote git repository to checkout deploy your changes to the directory being served:

#!/bin/sh
GIT_WORK_TREE=/path/to/webroot/of/mywebsite git checkout -f

Make sure you set the correct permissions:

chmod +x hooks/post-receive

I also keep my repository synced with GitHub, which is my origin remote. My deployment location is called deploy.

deploy  webhost:git_repos/my-blog.git (fetch)
deploy  webhost:git_repos/my-blog.git (push)
origin  git@github.com:FFAxKenny/blog.git (fetch)
origin  git@github.com:FFAxKenny/blog.git (push)

Not bad!

Its not a very complicated setup, but if you’re used to working in the command line, and with git, you’ll feel quite at home with this setup. No fear, git is here (with a deployment flow)!