Where to Discuss?

Local Group

Preface

Goal: Deploy SSG using Travis.

Most of the explanation doesn’t require coding at all. Using figures below as an explanation would be sufficient.

After explanation for dummies, there will be some kind of DevOps configuration using travis.yml. This a place to start learning for YAML engineer.

Official Site


1: Prepare Your Repository

Travis is a third party CI/CD. Travis can read from github/bitbucket repository, then build your favorite SSG, and write back to repository, or do something else, such as Amazon S3 thing. But unlike netlify or Zeit, Travis does not host anything.

Sign In

Your first attempt should be, creating account

Travis: Sign-in

Supported Repository

It is clear that Travis support these two git repositories:

I have successfully build in github. But I never try Travis for bitbucket. I just do not have time to explore Travis+Bitbucket tier.

Travis do not support gitlab. But do not worry, gitlab have their own internal CD/CD.

What happened when you sign in to an account with empty jobs? Consider have a look at my bitbucket account.

Travis: Sign-in with bitbucket

For the rest of this guidance, I’m going to use my github account. This would looks different, because I already have some Travis jobs over there.

Travis: Sign-in with github

Practice

Now you can make repository, with any name, for example:

  1. Jekyll:

  2. Eleventy:

  3. Hexo:

  4. Pelican:

  5. Hugo:

Github: Project Page Repository

This is just an example, you should use your username account. and you should use your own repository.


2: Prepare Your Jobs

Allright. I have a ready to use SSG, let’s say eleventy, that I have put in travis-11ty repository on github account. What to do next 🤔?

Example Configuration

Example configuration is copied from.

But it is altered for use with Eleventy, instead of Hexo.

Travis Configuration

Each SSG have a different configuration. For the sake of simplicity, consider ready to use .travis.yml configuration as below. I will explain the configuration later.

language: node_js
node_js:
  - 8

before_script:
  - npm install @11ty/eleventy -g

script: eleventy --pathprefix="/travis-11ty/"

deploy:
  local-dir: dist
  provider: pages
  skip-cleanup: true

  # Set in travis-ci.org dashboard, marked secure
  github-token: $GITHUB_TOKEN
  keep-history: true
  on:
    branch: master

Save this as .travis.yml. Add file, commit and push to travis-11ty repository.

Trigger a Build

How to create Jobs ? You should see a button with text trigger build on your dashboard.

Travis: Trigger a Build

Just click it. Your first build should be failed. Because you haven’t set $GITHUB_TOKEN yet. And you also cannot set any environment variable such as $GITHUB_TOKEN for your jobs before you trigger a build. This is why your first job attempt failed.

Travis: Failed Jobs

Get Github Token

You should get github token from your github account. Be aware that one token is used for all travis jobs.

Travis: Get Github Token

Set Github Token

On Travis side, you should set $GITHUB_TOKEN as environment variable.

Travis: Set Github Token

Restart Build

Hit the small Restart Build button.

Travis: Restart Build Button

You should see the build process started.

Travis: Processing build

Preview

In my case. It works well. And the site is served at:

Travis: Live Site

Job Log

Even when your site is built successfully, it is recommeneded for beginner to see the job log. This is the heart of CI/CD.

Travis: Job Log

We have enough image, we are going to examine the YAML configuration, in the next part.


What is Next ?

Consider continue reading [ CI/CD - Travis - Part Two ]. Finishing this worktree feature guidance with examples.