Jekyll, Codeship, Rakefile, and GitHub Pages

Photo Credit

Yah! I figured it out. When I looked for the solution, I found many sites with the same rakefile settings but none of them really helped me to figure out what I needed to do. I had to pick parts from each site to make mine work and I had to figure out some of the settings on my own. I hope I can write a good tutorial to help you set up your own. Come back often for updates.

What is a CI? It’s Continuous Integration or that action you took on your computer to build the site before you pushed the Jekyll _site folder contents to your GitHub repository. Now you allow Codeship to build it for you and you can use a source repo to host the unbuilt files and the master repo to host the generated static files. When you update or add a file in the source repo, as I am doing now writing this blog post, Codeship sees it and rebuilds the site.

An aquaintance showed me his Codeship setup using Hugo and other websites pointed me to TravisCI and CircleCI. But what I do notice about most tutorials is that they assume the reader knows everything they know and don’t include the solutions. It’s a Leonardo da Vinci schematic that’s missing one or two pieces of the puzzle. For other other engineers in the same field, maybe it’s easy for them to figure it out but for a tinker like me who just started yesterday, I need all the parts. Here’s the notes for myself but also for you.

Outline

  1. Create a Source repo on GitHub and set a Master repo for GitHub Pages.
  2. Create a free Codeship Basic account and build a custom script.
  3. Create a Rakefile and place it in your source repo.
  4. Add files to .gitignore in source repo.
  5. Edit/create file in Source repo and Codeship rebuilds site for Master repo.
  6. Copy CNAME to Master repo.

Step 2

  1. Create a free Codeship account and use the Basic plan. Choose Custom Script and in Project Settings under Tests section in the Setup Commands field put this, Ruby version on first line should match your local setup:
   rvm use 2.5.1 --install
   gem install bundler  
   gem install bundler jekyll  
   gem install rake  
   gem install sassc  
   bundle install
  1. Put nothing in the Configure Pipelines > Test Commands field and click “Save and Go to Dashboard.”
  2. In the Project Settings under Deploy in the Custom Scripts field put this:
    bundle exec rake generate_publish
  3. In the Project Settings under Repository, choose your Source repo.
  4. In the Project Settings under General, copy the SSH Public Key and in your Source repo on GitHub, go to repo Settings and Deploy Keys and make sure there’s an entry made by Codeship from previous step, if there isn’t, add a new key and paste in the SSH Public Key from Codeship.

Step 3

  1. Create the Rakefile (no extension) and place it in your Source repo.
   require 'tmpdir'
   desc "Generate jekyll site and publish to master branch"
   task :generate_publish do
   puts "## Install bundles"
   system "bundle install"
   puts "## Generating Site with Jekyll"
   system "bundle exec jekyll build --incremental"
   puts "## Jekyll Webmention"
   system "jekyll webmention"

   Dir.mktmpdir do |tmp|
   system "mv _site/* #{tmp}"
   system "cp CNAME #{tmp}"
   system "git checkout -b master"
   system "rm -rf _"
   system "mv #{tmp}/_ ."
   system 'git config --global user.email "yourgithub@youremail.com"'
   system 'git config --global user.name "Daniel Brinneman"'
   system 'touch .nojekyll'
   system 'git add .nojekyll'
   system "git add ."
   system "git commit -m 'Codeship Update'"
   system "git remote add ghub git@github.com:danielbrinneman/danielbrinneman.github.io.git"
   system "git push -u -f ghub master"
   end
   end

Step 4

Update .gitignore:

    .DS_Store
    .bundle
    .sass-cache
    Rakefile
    Gemfile.lock
    CNAME
    _site
    *.gem
    .ssh/*

Step 5

Write a new post or page and commit it to save changes. Codeship will automatically start regenerating the new static site and that usually takes about five minutes give or take.

Step 6

You can see in the Rakefile above, that it has system "cp CNAME #{tmp}" to copy the CNAME file into the regenerated temp directory that will be moved all at once to the Master repo. Then the site will not get a 404 but show at the domain name you use.

Notes

Video

In December 2018, I made a short video to show this setup for future reference. Like this video and subscribe to the channel, and if you’d like to see similar videos to it, leave a comment on my video.

Share on:

No webmentions were found.