CloudCannon consolidates editing and reliable hosting into a single package. Alternatively, you can use external hosting solutions and keep editing in CloudCannon. To demonstrate this workflow, we will use Amazon S3, a great platform to host static and Jekyll websites. The uptime is 99.9% guaranteed, it scales indefinitely and it’s cheap.

This tutorial shows you how to automatically deploy changes from CloudCannon/GitHub to S3 using Travis CI.

Setup

To begin, sign up for Travis CI.

Travis CI Homepage

Travis CI requires access to your GitHub account.

GitHub authentication

Click the add button next to My Repositories.

Travis CI Dashboard

Enable the repository with your Jekyll site.

Repository list

Scripts

Travis CI needs a configuration script in your repository describing how to build and deploy your site.

The script will set up Ruby:

language: ruby
rvm:
  - 2.1

Install the jekyll and s3_website gems. s3_website copies the website files to S3.

install: gem install jekyll -v 2.4.0 && gem install s3_website

Build the site using Jekyll:

script: jekyll build

Then copy the generated site to S3:

after_success: s3_website push

Copy the script to .travis.yml in your repository:

language: ruby
rvm:
  - 2.1
install: gem install jekyll -v 2.4.0 && gem install s3_website
script: jekyll build
after_success: s3_website push

s3_website needs a configuration file describing how and where to deploy the site. Your S3 Secret Key is private so it’s a bad idea to put it in your public repository. Instead, you can set and use an environment variable in Travis CI.

Copy the script to s3_website.yml and change s3_bucket to the name of your S3 bucket:

s3_id: <%= ENV['S3_ACCESS_KEY_ID'] %>
s3_secret: <%= ENV['S3_SECRET_KEY'] %>
s3_bucket: your.bucket.com

Environment Variables

The final step is to set environment variables for the S3 Access Key and Secret Key.

Go to settings and add your Amazon S3 credentials:

Travis CI environment variables

Every time you make a change to the repository in GitHub (including edits from CloudCannon), Travis CI rebuilds the site and deploys it to S3.

Summary

Travis CI is flexible enough to keep the easy-to-use editing in CloudCannon and host your site anywhere.