Jekyll and Github Pages is quite cool. But sometimes you don’t want your websites source code public. And sometimes you need some more plugins or custom code eg. for generating index pages of front matter itmes. There are some tools like aerobatic providing continous deployment [there are also free plans]. But I will show you my totally free auto test and deployment setup with Bitbucket and circleci to my private server.
All you need for deploying you static site automatically via git push
- Your Jekyll project has to be on Bitbucker or Github. I am using Bitbucket in this case because there are private repos included in the free plan. I think there is no need to go into detail.
- From there we will use circleci to checkout our repo for changes, test our static html files and deploy them to our private servers. circleci is a continous delivery platform with a free plan which is totally enough for our purpose.
- Finally you need a server and a domain. We are not going into details for this part as well. But your server should be accessible via ssh as we are going to move files via rsync to your servers.
- Grab your changes from Bitbucket with circleci.
- Let circleci build your site and test the static html files with html-proofer.
- Move your site to your private server via ssh.
Preparing for circleci
Before we start configuring circleci let’s set up a Rakefile which is building and testing our jekyll site. If you do not have html-proofer installed yet add
gem 'html-proofer' to your Gemfile and run
bundle install. Run
htmlproofer _site in your jekyll project to test your HTML files and be sure there are no failures.
Rakefile to build and run HTML tests
Now add a file named
Rakefile to your repositories root. It will build our Jekyll site and test the outcoming html files with html-proofer. Copy the following into the Rakefile:
Deployment steps on circleci
It is time to configure your repositories circleci build setup. Add a circle.yml file in your repositories root and copy the following:
The first block is checking out only the master branch. You can leave it if you want to check all commits or configure however you want.
The second block is executing the ship method in our Rakefile.
The last block is moving the
_site folder to your server. Please enter your username on your server, your server address and the final directory. And do not forgot the colon
: between server and path.
SSH key on your server
Connect to your server on the command line with
ssh [email protected] and your password. Now generate a ssh key with
ssh-keygen. This will add a hidden folder
.ssh with the public key
id_rsa.pub and the private key
id_rsa. We will dublicate the public key to file called
cp .ssh/id_rsa.pub .ssh/authorized_keys. Next we will copy the private key and remove the file from the server for security reasons. Run
cat .ssh/id_rsa and copy the outcome into your clipboard. Remove the file with
rm .ssh/id_rsa. Add a backup file for you private key on you local machine. Next we will use the private key to authenticate circleci on your server.
Authorize circleci on your server
Signup to circleci with your Bitbucket account if you do not have already. Now you should see your jekyll project repository on circleci. Click the build project button to create a project and skip the first build. Go to project settings and find the SSH permissions section and create there a new ssh key. Copy you private key to the textarea and save it.
Now run the first build and check if it is green and your jekyll site is on your server. If you have trouble drop a comment and I’ll try help you. Good Luck.