Blogging with Ghost and GitHub Pages: Part 1

For my initial blog post, I thought I would share how I got this site up and running - using Ghost as my blogging platform and Github pages as my (free!) hosting option. This guide might seem long, but everything should take around 15 minutes or so.

Ghost provides an alternative option to the popular Medium. It allows for more customization and provides additional features, without losing the simplicity and content-focus that Medium users love. However, their cheapest hosting option is $19 a month - it won't break the bank, but it's a little pricey for someone who just wants to publish a post every once in a while. Luckily, they're generous enough to share their code for free! You just need to find a way to host your blog. This is where GH pages comes in.

(Not sure if it's worth the trouble? You can try out Ghost's blogging platform with a free trial before jumping into setup!)

Requirements

We'll assume that you have the following:
1) A GitHub account - you'll need this to use GH pages.
2) Node.js, npm, Homebrew, Xcode installed.
3) These steps are written for Mac OSX.

There are tons of resources on these things, so we won't cover them here. We'll also assume some basic knowledge of the command line, since not only will we be using that to set everything up, but we'll also use it in the future to make changes to our blog.

Let's get started!

Step #1: Installing Python Package Index

In your Terminal, type the following command:

$ sudo easy_install pip 

Step #2: Confirm correct version of Node

Ghost only supports certain versions of Node, so you'll need to ensure you're using the correct version before moving on. In your terminal, type in the following to check the version you're using:

$ node -v

You should see the version number in your terminal. Ghost currently supports versions 0.10.x, 0.12.x and 4.2.0+ (up to, not including 5.0.0) only, so if your version is anything else, we'll need to change that. Luckily, there is n - an easy-to-use, interactive Node version manager.

To install n, type the following in the terminal:

$ npm install -g n

Then, install Node.js version 4.2.0.

$ n 4.2.0

Now, we can check the version and see the correct version installed.

$ node -v
> v4.2.0

Step #3: Downloading Ghost

This is easy - just download Ghost from their website! When the download finishes, unzip the file. Place it wherever you'd like, and rename the directory if you wish. We'll rename ours 'ghost-setup' to clarify that this isn't where our blog posts will go.

Now, we can run npm install in this directory. If we're using the correct version of Node, we shouldn't run into any problems here.

$ npm install 

Step #5: Installing Buster

Buster was created to help you generate a static site using Ghost. That's mostly a fancy way of saying it makes your local changes appear. Installing it with the following commands in your terminal:

$ pip install buster 

Step #6: Setting up your GitHub pages repository

Create a new GitHub repo, titled username.github.io. (Replace username with your exact GitHub username!)

This will automatically create a GitHub page for you, with the url https://username.github.io/. For further explanation on this, you can check out GitHub's explanation of this here. Note that Buster only works if if we don't do anything to our repo! Just create it, and leave it there for now.

Step #7: Creating static files

We'll need to create a folder now to contain our actual blog files. (Remember, we're using our directory ghost-setup to contain the ghost files, but not our posts.) Let's name this ghost-blog to differentiate.

Inside this directory, run this command:

$ buster setup 

You'll be asked for your GitHub repo - enter in the following, replacing username with your GitHub username.

https://github.com/username/username.github.io.git`  

This will automatically create a folder in your directory titled "static", which will contain all the files that make your blog.

Now, run this command:

$ buster generate --domain=http://localhost:2368

Your static folder should be in sync with your GitHub repo (magic!). Don't worry about all the complexities here!

All done!

Your blog should be all set up! You can confirm this by going to your new GitHub page: https://username.github.io/. You should see Ghost's default layout, and an example post they've published for you.

In the next post, we'll cover how to actually use what we've done to start blogging!

Click here to read part 2 (Not completed yet! Link will be there when it is.)