DEV Community

Cover image for From Wordpress to Gatsby -- Updating my blog!
Ayotunde Ikuesan
Ayotunde Ikuesan

Posted on • Edited on

From Wordpress to Gatsby -- Updating my blog!

I recently updated my blog. Except this time, I wanted to try something different. If by some miracle you're an avid follower of my blog, you'll know I've been a fan of WordPress for many years. The platform powers around 30% of the internet and has gained a cult following amongst many bloggers, developers and publications around the world.

Alas, not too long ago, I decided that it's no longer for me. Not for the first time mind you, but this time I'm fairly certain that decision is going to stick.

The problem

My biggest problem with the platform is one of its most important features: themes and templates. Trying to style one of these themes to get it to look exactly how I want is guaranteed to ruin any day. As a web developer, the restricted layout and styling options provided hinder my creativity. And the interface which allows me to express whatever amount of said creativity is left, is just as poor. Limited CSS, only a handful of colour palettes, paying more to unlock more features and relatively slow page loads led me to a dark and lowly place: I had a created website I secretly hated.

"Jeez man, so dramatic. Why don't you just self host?" 🙄

It's true, a self-hosted instance of WordPress would have allowed me to upload my own fully designed template and install a whole host of plugins, without paying significantly more. But hosting WordPress on your own is a tricky business. Security vulnerabilities are lurking around every corner and I don't have the experience to confidently manage my own LAMP stack.

Don't even get me started on PHP.

The solution

I needed a platform that would allow for a few of things:

  • Freedom to easily style my blog any way I like
  • Use of modern web development languages and architectures
  • Super fast
  • Super cheap

That's all I asked for.

A few thorough Google searches later (going all the way to page three folks), I came across a cool tool called Ghost.

Think of Ghost as being like that really popular dude at your school or work that your friend introduces you to, then you realise you already know them. Ghost powers the publications behind some of the world's biggest companies: Apple, Tinder and DailyMotion just to name a few. When I started looking for an alternative to WordPress, I hadn't heard of Ghost beforehand (apart from once but I think that was an accident). In a lot of ways it's similar to WordPress, but it's different enough in all the ways that count:

  • I can fully customise everything about this website, from head to footer.
  • The platform runs on Node.js, bringing it into the era of modern web development.
  • Advanced SEO tools also come as standard (paid with Wordpress.com), making tunde.io more visible on the web and across social media. Which is good because not a lot of people are searching or indeed asking for it.
  • $5/month hosting with Digital Ocean 🌊

(Dare I sneak in a free referral link for DO? I do! https://m.do.co/c/73c719991456)

Good, but not good enough

I wasn't finished there. Ghost would turn out to only be part of the story. I had the whole blog set up – ready to push that big blue publish button and go live – when I started to think about scaling. Let's be optimistic for a second and assume that one day, a vast number of people want to access the blog (I can't think of a valid reason either). That's gonna put a lot of pressure on the one server I had set up to run the website. With new page requests coming in every single second from every corner of the globe, that server would only crash and burn, leaving a pool of melting 1s and 0s...

So I took myself back to Google, in search of more wisdom, and came across Gatsby. Gatsby is a static site generator. Put simply, SSGs allow you to create websites that serve pre-compiled web pages, rather than dynamically generating the content whenever you want to access a page. Imagine having your Facebook feed loaded as soon you clicked facebook.com, rather than having to wait for a database to be queried to generate all of your friend's cat pics.

Having everything ready to go in these pre-compiled pages, reduces the amount of time it takes to serve that page to you, making all of the things so much faster. These compiled pages can also be served efficiently via a CDN, significantly reducing server cramp and providing you with even faster content delivery times.

So how does this all tie in here? Well, Ghost has been set up in such a way that it's possible to retrieve only the content (i.e. my blog posts and pages) via an API -- a headless CMS if you will. Gatsby then takes that content and spits out what you're reading right now. This spit, gets pushed to a CDN, ready when you are to serve the pages, fast. Almost - almost, like a bird feeding a chick. And because of the way Gatsby is integrated with Ghost, I lose none of those benefits listed earlier.

It's probably a bit overkill for my little corner of the world wide web, I'm fully aware. Check out the end result for yourself at tunde.io. Whether you do or don't, the nerd in me thinks it's all rather cool.

Nerd Gif

Top comments (0)