Publishing A Hugo Blog With An iPad

· wordCount · 4 minute read

My iPad is old now in years but it’s still a very convenient form factor for me. I wrote previously about how to use R Studio on it. One activity proved to be somewhat tedious: blogging.

To explain, what I’m after:

  • ability to write articles on an iPad
  • ability to write offline
  • preview unpublished articles
  • one click publishing

I also come with some familiarity with Hugo, the static blog builder, so I wanted to carry on using that.

Here’s what I’ve hit on to achieve this:

  • use Hugo as the blogging framework & tool
  • use GitHub to store the blog
  • use Amplify to show previews and publish

The key tech here is Amplify.

My writing process becomes:

  1. Write a draft post on the iPad, committing and pushing as I go.
  2. Creating a preview branch and viewing the previewed post, making any changes as necessary.
  3. When I’m ready to publish, merging the preview branch into main.

Now let’s get into a little more detail.

Setting Up Amplify & Working Copy 🔗

Amplify 🔗

Amplify is an Amazon service concerned with hosting and build sites, both static and dynamic. Here I am using it to track a GitHub repository, automatically build a Hugo static website from any changes pushed to that repository, and to use git branches to preview changes in a temporary subdomain. All of this without touching a real command line or non-iOS desktop.

I have followed this Hugo guide to setting up Amplify to serve Hugo blogs.

I have configured a single app:

Amplify Apps

Here you can see the status change for the main branch (master) which publishes to the main domain:

Amplify Branches

Here is the details page

Amplify Configuration

Working Copy 🔗

This is an iOS app that makes making changes to a git repository, pushing changes etc. easier. With it I create, edit and delete files, preview markdown, almost everything I need to create posts.

Publishing Process 🔗

Briefly, the process is this:

  1. create a branch
  2. make changes (eg a new post) within this branch
  3. when I am ready to preview them, push these changes to GitHub and create a pull request for it
  4. Amplify creates a temporary domain with these changes by running Hugo against the branch
  5. I can make more changes to the branch and keep previewing until I’m ready to publish
  6. Finally, merge the branch into main; Amplify will then publish this to the main domain

Creating A Branch 🔗

This is easy to do in Working Copy - of course one can create one on Gitub instead.

Previewing Changes 🔗

Let’s say I’ve made some changes in a branch that I have pushed to Github. I then create a Pull Request - as soon as I have done that Amplify will notice and create a new preview site:

Amplify Branch Deployment

You can see here it provides link to a preview site - this obscure url serves only the content of the branch.

NB I found managing pull requests awkward in Working Copy, so I performed that directly on Github.

Publishing The Changes 🔗

When I’m ready to publish I merge the pull request. Amplify will pick this up and deploy to the main site.

Previews stay around until the branch is deleted.

Costs 🔗

There are some costs to this approach:

  • Amplify: a few dollars (see below)
  • GitHub: $4

You may of course not need to spend any money on GitHub; using it for this blog is merely a sideline for me.

Amplify pricing follows the usual AWS pattern of charging per GB per month, build time etc. - for me this comes to at most a few dollars per month, depending on activity. Of course it could be much higher if you are hosting some slashdottable site - take a look at their pricing examples.

Conclusion 🔗

There are a few moving parts in this system; I would not suggest this to anyone who wants to do zero under the hood shenanigans. However, once setup it’s pretty seamless from my perspective as a user. The fiddliest thing I have to do each time is adjust the date in my copied draft posts.

Variations are possible of course. If you are using Jekyll you may want to use GitHub itself but it would work here too.