Deploying Static Site to GitHub Pages via Travis CI

Home > Blog > Programming > Deploying Static Site to GitHub Pages via Travis CI

2017-06-26

Deploying Static Site to GitHub Pages via Travis CI

As I repeatedly mentioned in this blog, takuti.me is currently generated by Hugo:

Manual deployment

Until quite recently, my deployment workflow was not clever; I manually followed the steps as:

Write an article under takuti.me/_content directory
Hit rake command and generate my site under the public/ directory
Commit & push takuti.me/* to repository (source), except for public/
Commit & push takuti.me/public/* to repository (GitHub Pages)

It actually works, but we can automate the workflow more aggressively...it's 2017!

Utilizing `deploy:` feature on Travis CI

So, eventually deployment becomes easier thanks to the following guide:

GitHub Pages Deployment - Travis CI

My current .travis.yml looks like:

language: c
os: osx

before_script:
  - npm install -g gulp
  - npm install
  - brew update && brew install hugo

script:
  - rake

branches:
  only:
    - master

notifications:
  email: false

deploy:
  provider: pages
  skip_cleanup: true
  local_dir: public
  github_token: $GITHUB_TOKEN # Set in travis-ci.org dashboard
  on:
    branch: master
  repo: takuti/takuti.github.io
  target_branch: master
  fqdn: takuti.me

Once you have set your $GITHUB_TOKEN to environment variables in travis-ci.org, CI on source repository automatically generates your site and pushes it to GitHub Pages repository; now what we have to do is:

Write an article under takuti.me/_content directory
Commit & push takuti.me/* to repository (source), except for public/

Neat, huh?

In case that you are using custome domain on GitHub Pages like me, setting fqdn: as fqdn: takuti.me enables Travis CI to automatically create the CNAME file under xxx.github.io repository.

Unfortunately, the CI-based deployment still has problems.

First, Deployment Bot removes all of your commit logs in xxx.github.io repository; it forcibly pushes to the repository:

travis-deploy-bot

In addition, since installation such as npm install and brew install is necessaly for every time CI is launched, deployment usually takes more than 5 minutes.

In fact, these are minor problems from a practical point of view, but I personally believe that deploying static site can be more efficient and technologically stimulating by different approach e.g., using Docker containers. So, I continuouslly try to update how to organize takuti.me.

Support (Thank you!)

Gift a cup of coffee

Author: Takuya Kitazawa

Takuya Kitazawa is a product developer, minimalistic traveler, ultralight hiker & runner, and craft beer enthusiast. Throughout my career, I have practically worked as a full-stack software engineer, OSS developer, technical evangelist, sales engineer, data scientist, machine learning engineer, and product manager. See my "now" page for more about what I am doing lately.

Set up a 1:1 call with me

Opinions are my own and do not represent the views of organizations I am/was belonging to.