Gatsby Blog

GatsbyJS

I’ve developed this blog mainly using GatsbyJS, incredibly fast static site generator for React.

I have spent quite some time to decide which tool to use for my blog and finally decided to use Gatsby.

The main reasons are as follows:

• The site generation is super simple and Gatsby follows the rules of Progressive Web
• Gatsby allows me to further dive into React which I have been learning lately
• Deploying website was also easy using surge.sh

I initially thought of using Wordpress or Jekyll because those are the most popular site/blog generator out there.

Wordpress might have been a good choice because I am comfortable using PHP but I heard a lot of stories of how Wordpress is becoming outdated.

In addition, Jekyll had advantage of being able to directly use Github page which is super convenient but required some knowledge of Ruby.

As a result, thanks to this article on Medium, I found out about GatsbyJS which is a rising static generator for React.

As for the theme of this blog, I used Gatsby blog starter from this repo.

Disqus (Updated on Aug, 22)

Disqus is a great tool for implementing comment system into your website easily. If you log into Disqus, you will find that Disqus provides numerous platform for installation. Unfortunately, they don’t seem to support Gatsby yet and universal embed code isn’t relevant as it directly handles DOM element (not allowed in React).

As a result, I have looked into some of the react components for Disqus:

• most famous one: react-disqus-thred
• similar version
• modified version
• one I used

I made a new component using the link above and named the folder Comments.

import { config } from 'config';

const SHORTNAME = config.disqusShortname;
const WEBSITE_URL = config.blogUrl;

I replaced shortName and website_url using by creating disqusShortname and blogUrl in the config.toml file.

Deployment

I had two options for deployment, surge.sh and Netlify. I first tried using surge.sh and it was incredibly fast in deploying the website. However, it was quite inconvenient in that it didn’t link with Github repository directly.

As a result, I decided to use Netlify which had great documentation on deploy Gatsby-generated website. Most importantly, it allowed direct link with either Github or Bitbucket.

Custom Domain/hosting

Although I have not added any custom domain for my blog yet, I intend to do so in the near future. I haven’t decided which service provider to use. I will upload another blog post on hosting when I do so.