Jan 7, 2020 • 3 min read

The Great Gatsby Makeover

I've never been much of a blogger but I've always managed to maintain a personal website. In the past I've used various blogging platforms - from blogspot (please don't go looking for it) to Wordpress to Tumblr and to static site generators like Jekyll and Hugo. I realised I was spending too much time designing and building the site and rather than focussing on the content. I moved to Medium as a result. Despite my many frustrations with Medium, I really enjoyed the writing experience.

Ownership

One of the downsides of blogging on Medium is that you don't own the content. This wasn't a big deal to me initially but then I started to see the benefits of owning a personal blog.

• Personal Brand - Blogging helps developing your personal brand. You become known for your work and this will improve your reputation in the community. John Sundell's Swift by Sundell and Paul Hudson's Hacking with Swift are some great examples.

• Sharing Knowledge - There have been so many times in the past where I've solved an issue after being stuck on it for a long time. Although I'd want to share the solution with the community, I never managed to do it because of the lack of a personal blogging platform. It helps to document these kind of findings in case you encounter the issues in the future. Also, it is very satifying when someone thanks you for one of your works.

• Teaching as a way to learn - Back in 2014, when I was learning Swift, I took down notes to share with my coworkers. The notes eventually transformed in to huge Swift Playground file repository that was used to teach engineers seeking to learn Swift. I think the best way to come up with blog posts is by documenting your learnings.

Why Gatsby

Early 2018, I started looking in to recent developments in web and I kept stumbling upon JAMStack. It's a term coined by folks at Netlify for a way to build websites and apps. The websites won't really have a back-end. Instead, it's just static HTML, using Javascript APIs, served from a CDN near you.

Getting started with JAMStack - Enter GatsbyJS

The whole idea of JAMStack was too good and I couldn't resist building my website using this concept. I don't know enough React to build from scratch. This is where a Static Site Generator can help. I decided to go with Gatsby because of its rich support for plugins and huge collection of starter templates.

Gatsby.js is a static PWA (Progressive Web App) generator. You get code and data splitting out-of-the-box. Gatsby loads only the critical HTML, CSS, data, and JavaScript so your site loads as fast as possible. Once loaded, Gatsby prefetches resources for other pages so clicking around the site feels incredibly fast.

Beyond Static

Even though Gatsby generates static files, Gatsby apps rehydrate from static HTML rendered by ReactDOM APIs into an app running client-side JavaScript. For example, if Gatsby fetches data at build time from a datasource such a database, an external API etc., then static files can be generated from that data. During run time, your Gatsby app can respond immediately with static assets while hydrating itself with additional data / interactivity as needed after initial render.

Because all Gatsby pages are hydrated into React, any of the following patterns are capable of app-like behavior. The line between static content vs dynamic app concept gets extremely blurry.

Plugins and integrations

Gatsby also has a well architected plugin-system that meets most of your needs. The plugins are modern, plentiful, and easy to create if needed. Beyond all the plugins, Gatsby provides integrations into tools like Contentful.

Deploy

I chose to deploy the site on Netlify. Netlify also provides continuous deployment (Git-triggered builds); an intelligent, global CDN; full DNS (including custom domains); automated HTTPS; asset acceleration; and a lot more.

That's it. Pretty simple setup and it didn't take much time. Let's hope I maintain a decent streak at blogging 🤞