Last Year …
To learn about Cloud last year, and to work on a couple of personal projects, I set out to run Ghost on a Google Compute Engine VM. I like the Casper theme, and the CMS is top-notch. The problem was getting it into production. I had to:
- Spin up a VM, configuring boot and content disks
- Create
docker-compose
files that allowed Ghost to run in a Docker image with content saved on a mapped drive - Configure nginx to use LetsEncrypt certificates for SSL
- Front the VM instance with a CloudFlare CDN
I eventually got a version of buster
to generate static content and moved production hosting to Github Pages (so I didn’t have to pay to run a VM all the time), but this is still a lot to maintain.
I finally learned Gatsby…
I get paid to work in React and GraphQL, so it seemed about time for me to learn about Gatsby. If you’re not a developer, the learning curve is really steep. Forget about it. If you are a developer, and you’re already familiar with React and GraphQL, it’s pretty cool! There’s a lot I like. But it does require work out-of-the-box to get it to look and work the way you want.
How I migrated content
- Bootstrap your Gatsby site. After trying several starters, I went with Novela by Narrative because it’s pretty, it expects content in a way that I like, and it uses a Gatsby “theme”, which means less code in my blog repo.
- Export from Ghost: Log in to the admin, go to Settings -> Labs -> Export your content, and get a JSON of all your content.
- Explode the JSON into Markdown files. There are several tools out there for this:
ghost-to-gatsby
does a great job of creating folders for content, but won’t convert HTML to markdown. I was left with a lot of “undefined” in all my content files.ghost-to-md
does a stellar job of turning the HTML into markdown content. However, it leaves each post in its own file, so I had to do a little batch processing to get this into the folders that Novela expects, and to tweak the front matter.
- Put it all in a GitHub repo
- Head over to Netlify, authenticate with your GitHub creds, and create a “New Site from Git”, and you have a CI publish integration running in a matter of seconds.
Some thoughts
Netlify is incredible. They don’t even ask for a credit card! I have used a lot of cloud services, and few are as easy to use and as useful.
I’m still figuring out Gatsby. I can’t stress enough that you will have to write code to make your site do what you expect. Gatsby is a phenomenal framework, and I like many of the things it is opinionated about, but it still leaves a lot of the heavy lifting up to you.
I’m still learning styled components. Yeah, I know, the “cool kids” have been on this train for a few years now, but the way I see them used in a bunch of the Gatsby starters mixes data model and view a bit too much for me. It’s a step better than inlining styles, but after spending years relying on CSS frameworks like Bootstrap and Material, I have come to expect that styling is better done way-outside my view components.
Component shadowing is way cool. Shadowing is a very powerful way to extend a theme, and a great topic for another post.