cbillowes/curious-programmer-helium

View on GitHub
content/posts/2018/2018-08-28-behind-the-scenes-my-blog.md

Summary

Maintainability
Test Coverage
---
title: "Behind the Scenes: My Blog"
date:   2018-08-28 05:20:00 +0200
tags:
    - Technical
    - Personal Brand
---

I developed **corporate** programmer using a Ruby-based static-site generator called [Jekyll](https://jekyllrb.com/). It transforms Markdown, [Liquid](https://github.com/Shopify/liquid/wiki), HTML and CSS to a static website so that no is database required.

While I was planning to [leave the corporate world](https://curiousprogrammer.io/blog/sayonara), I started rebranding. I wanted a change. A new look. A new tech. A new name.

## My blog
<svg width="106" height="28" xmlns="http://www.w3.org/2000/svg" style="float: left; margin-right: 1em; margin-bottom: 0.25em;">
 <style type="text/css">.st0{fill:#fff}.st1{fill:#639}</style>
 <g>
  <g id="svg_1">
   <path fill="#ffffff" id="svg_2" d="m62.9,12l2.8,0l0,10l-2.8,0l0,-1.3c-1,1.5 -2.3,1.6 -3.1,1.6c-3.1,0 -5.1,-2.4 -5.1,-5.3c0,-3 2,-5.3 4.9,-5.3c0.8,0 2.3,0.1 3.2,1.6l0,-1.3l0.1,0zm-5.2,5c0,1.6 1.1,2.8 2.8,2.8c1.6,0 2.8,-1.2 2.8,-2.8c0,-1.6 -1.1,-2.8 -2.8,-2.8c-1.6,0 -2.8,1.2 -2.8,2.8z"/>
   <path fill="#ffffff" id="svg_3" d="m71.2,14.4l0,7.6l-2.8,0l0,-7.6l-1.1,0l0,-2.4l1.1,0l0,-3.4l2.8,0l0,3.4l1.9,0l0,2.4l-1.9,0z"/>
   <path fill="#ffffff" id="svg_4" d="m79.7,14.4c-0.7,-0.6 -1.3,-0.7 -1.6,-0.7c-0.7,0 -1.1,0.3 -1.1,0.8c0,0.3 0.1,0.6 0.9,0.9l0.7,0.2c0.8,0.3 2,0.6 2.5,1.4c0.3,0.4 0.5,1 0.5,1.7c0,0.9 -0.3,1.8 -1.1,2.5c-0.8,0.7 -1.8,1.1 -3,1.1c-2.1,0 -3.2,-1 -3.9,-1.7l1.5,-1.7c0.6,0.6 1.4,1.2 2.2,1.2c0.8,0 1.4,-0.4 1.4,-1.1c0,-0.6 -0.5,-0.9 -0.9,-1l-0.6,-0.2c-0.7,-0.3 -1.5,-0.6 -2.1,-1.2c-0.5,-0.5 -0.8,-1.1 -0.8,-1.9c0,-1 0.5,-1.8 1,-2.3c0.8,-0.6 1.8,-0.7 2.6,-0.7c0.7,0 1.9,0.1 3.2,1.1l-1.4,1.6z"/>
   <path fill="#ffffff" id="svg_5" d="m85.8,13.3c1,-1.4 2.4,-1.6 3.2,-1.6c2.9,0 4.9,2.3 4.9,5.3c0,3 -2,5.3 -5,5.3c-0.6,0 -2.1,-0.1 -3.2,-1.6l0,1.3l-2.7,0l0,-16.8l2.8,0l0,8.1zm-0.3,3.7c0,1.6 1.1,2.8 2.8,2.8c1.6,0 2.8,-1.2 2.8,-2.8c0,-1.6 -1.1,-2.8 -2.8,-2.8c-1.7,0 -2.8,1.2 -2.8,2.8z"/>
   <path fill="#ffffff" id="svg_6" d="m98.5,20.5l-4.8,-8.5l3.3,0l3.1,5.7l2.8,-5.7l3.2,0l-8,15.3l-3.2,0l3.6,-6.8z"/>
   <path fill="#ffffff" id="svg_7" d="m54,13.7l-2.8,0c0,0 -4.2,0 -4.2,0l0,2.8l3.7,0c-0.6,1.9 -2,3.2 -4.6,3.2c-2.9,0 -5,-2.4 -5,-5.3s2,-5.4 4.9,-5.4c1.6,0 3.2,0.8 4.2,2.1l2.3,-1.5c-1.5,-2.1 -3.9,-3.3 -6.5,-3.3c-4.4,0 -8,3.6 -8,8.1s3.4,8.1 8,8.1s8,-3.6 8,-8.1c0.1,-0.3 0,-0.5 0,-0.7z"/>
  </g>
  <g id="svg_8">
   <g id="svg_9">
    <path id="svg_10" d="m25,14l-7,0l0,2l4.8,0c-0.7,3 -2.9,5.5 -5.8,6.5l-11.5,-11.5c1.2,-3.5 4.6,-6 8.5,-6c3,0 5.7,1.5 7.4,3.8l1.5,-1.3c-2,-2.7 -5.2,-4.5 -8.9,-4.5c-5.2,0 -9.6,3.7 -10.7,8.6l13.2,13.2c4.8,-1.2 8.5,-5.6 8.5,-10.8z" class="st0"/>
    <path id="svg_11" d="m3,14.1c0,2.8 1.1,5.5 3.2,7.6c2.1,2.1 4.9,3.2 7.6,3.2l-10.8,-10.8z" class="st0"/>
   </g>
   <path id="svg_12" d="m14,0c-7.7,0 -14,6.3 -14,14s6.3,14 14,14s14,-6.3 14,-14s-6.3,-14 -14,-14zm-7.8,21.8c-2.1,-2.1 -3.2,-4.9 -3.2,-7.6l10.9,10.8c-2.8,-0.1 -5.6,-1.1 -7.7,-3.2zm10.2,2.9l-13.1,-13.1c1.1,-4.9 5.5,-8.6 10.7,-8.6c3.7,0 6.9,1.8 8.9,4.5l-1.5,1.3c-1.7,-2.3 -4.4,-3.8 -7.4,-3.8c-3.9,0 -7.2,2.5 -8.5,6l11.5,11.5c2.9,-1 5.1,-3.5 5.8,-6.5l-4.8,0l0,-2l7,0c0,5.2 -3.7,9.6 -8.6,10.7z" class="st1"/>
  </g>
 </g>
</svg>

I wanted a new blog. I was introduced to [Gatsby](https://www.gatsbyjs.org/), a blazing fast static site generator for React.

This was handy as I wanted to learn React. Off I went to implement it using the [Gatsby Advanced Starter](https://github.com/Vagr9K/gatsby-advanced-starter), because why start small?

This starter kit has a lot of features including **offline support** and **web sockets** which I think is rad. I must admit that it tricky for me, as a beginner, to implement - but I came right and the site came out better than I expected it to. I still have a few features that are outstanding.

## My brand
<svg class="logo-mark" style="fill:#00a63f" viewBox="0 0 367.7 78.1" xmlns="http://www.w3.org/2000/svg" width="150px"><path class="logo-mark-color" d="M95.3 38.6c0-4.6-3.6-8.4-8.3-8.4-4.6 0-8.3 3.8-8.3 8.4s3.6 8.3 8.3 8.3 8.3-3.7 8.3-8.3m14.4.1c0 11.9-10.1 21.4-22.6 21.4-12.6 0-22.6-9.5-22.6-21.4 0-12 10.1-21.6 22.6-21.6 12.5-.1 22.6 9.6 22.6 21.6M154.8 30c0-8-5.6-15-13.9-15h-11.5v30.3h11.5c8.3 0 13.9-7.3 13.9-15.3m15.5 0c0 17.1-12.1 28.8-29.1 28.8h-24.6c-1.2 0-2.1-.9-2.1-2V3.4c0-1.1.9-2 2.1-2h24.6c17.1.1 29.1 11.5 29.1 28.6M194.4 46.9c4.6 0 8.3-3.8 8.3-8.4s-3.6-8.4-8.3-8.4c-4.6 0-8.3 3.8-8.3 8.4 0 4.7 3.7 8.4 8.3 8.4M192.2 17c4.9 0 8.8 1.8 10.5 4.3v-1.2c0-1.1.9-1.9 1.9-1.9H215c1.1 0 1.9.8 1.9 1.9v36.8c0 1.1-.8 1.9-1.9 1.9h-10.3c-1.1 0-1.9-.8-1.9-1.9v-1.2c-1.7 2.5-5.7 4.3-10.6 4.3-10.4 0-20.4-8.3-20.4-21.6s10-21.4 20.4-21.4M241.4 46.9c4.6 0 8.3-3.8 8.3-8.4s-3.6-8.4-8.3-8.4c-4.6 0-8.3 3.8-8.3 8.4 0 4.7 3.7 8.4 8.3 8.4M238.9 17c5 0 8.9 1.9 10.7 4.1V3.4c0-1.1.9-1.9 1.9-1.9H262c1.1 0 1.9.8 1.9 1.9V57c0 1.1-.8 1.9-1.9 1.9h-10.3c-1.1 0-1.9-.8-1.9-1.9v-1.2c-2.1 2.5-5.7 4.3-10.6 4.3-10.4 0-20.4-8.3-20.4-21.6S228.7 17 238.9 17M288.4 46.9c4.6 0 8.3-3.8 8.3-8.4s-3.6-8.4-8.3-8.4c-4.6 0-8.3 3.8-8.3 8.4.1 4.7 3.7 8.4 8.3 8.4M286 17c5 0 8.9 1.9 10.7 4.1V3.4c0-1.1.9-1.9 1.9-1.9H309c1.1 0 1.9.8 1.9 1.9V57c0 1.1-.8 1.9-1.9 1.9h-10.3c-1.1 0-1.9-.8-1.9-1.9v-1.2c-2.1 2.5-5.7 4.3-10.6 4.3-10.4 0-20.4-8.3-20.4-21.6S275.7 17 286 17M345.5 64.7c-2.6 8.6-8.6 13.4-18 13.4-5.1 0-10.1-1.7-13.3-4.5-.5-.5-.8-1.1-.8-1.7 0-.5.2-1.1.7-1.7l3.9-5.9c.6-.8 1.5-.9 1.7-.9.9 0 1.3.2 2.1.8 1.2.8 2.9 1.8 4.8 1.8 1.6 0 3.7-.7 4.5-3.1l1.3-4.1H326c-1.3 0-2.1-.9-2.5-2L313 21.5c-.2-.9-.3-1.4-.3-1.7 0-.8.6-1.5 1.7-1.5h12.4c1.1 0 1.7 1 2 2l6.9 25.4h.5l5.5-25.4c.2-1 .9-2 2-2h12.6c1.2 0 1.7.7 1.7 1.5 0 .3-.1.8-.3 1.7l-12.2 43.2M49.7 50.9c-5 6.9-13.2 9.2-20.5 9.2C12.4 60.1 0 47.6 0 30.2.1 13.5 13.5.2 31 .2c13 0 23.4 5.5 28.1 16 .6 1.2 1 3.2-2.5 3.8l-9.2 1.6c-2.1.4-3.3-1-3.7-1.6-2.7-3.7-7.1-6.2-12.4-6.2-9.2 0-15.7 7-15.7 16.3 0 10.3 7.4 16.3 15.5 16.3 5.4 0 9.8-2 12.7-5.8h-8.1c-1.2 0-2.1-.9-2.1-2v-7.7c0-1.1.9-2 2.1-2h24.7c1.2 0 2.1.9 2.1 2v25.9c0 1.1-.9 2-2.1 2h-8.6c-1.2 0-2.1-.9-2.1-2v-5.9M359.8 0c-4.4 0-8 3.6-8 8s3.6 8 8 8 8-3.6 8-8-3.6-8-8-8zm0 14.4c-3.5 0-6.4-2.9-6.4-6.4s2.9-6.4 6.4-6.4 6.4 2.9 6.4 6.4-2.9 6.4-6.4 6.4z"></path><path class="logo-mark-color" d="M361.4 6.5c0-.4-.1-.7-.4-.8-.2-.2-.6-.4-.9-.4h-1.4v2.3h1.4c.4 0 .7-.1.9-.4.2-.2.4-.4.4-.7zm-3.1 5.9h-1.5c-.1 0-.1 0-.2-.1 0-.1-.1-.1-.1-.2V3.8c0-.1 0-.1.1-.2.1 0 .1-.1.2-.1h3.3c1.1 0 1.9.2 2.5.8s.9 1.3.9 2.1c0 .6-.1 1.1-.5 1.5-.4.5-.7.8-1.2 1.1l1.9 2.9c.1.1.1.2 0 .4 0 .1-.1.1-.2.1H362c-.1 0-.2 0-.4-.1-.1 0-.1-.1-.2-.2l-1.6-2.7h-1.2V12c0 .1 0 .1-.1.2s-.1.2-.2.2z"></path></svg>

I wanted a new name. I settled on **curious** programmer after a lot of different ideas that came to mind.

I chose the name because I am curious about how things work and what is in store for me in my Clojure and Cloud infrastructure journey. It is also happens to be similar to my former brand.

I visited [GoDaddy](https://godaddy.com) to secure the curiousprogrammer.io domain and had to work extra hard to get my blog ready.

## Hosting
<img src="https://flaviocopes.com/netlify/banner.png" width="150px" style="float: left; margin-top: 0.5em; margin-right: 1em;" />

I wanted new hosting. I used to host at [BlueHost](https://www.bluehost.com/) but I was stuck with an FTP and cpanel approach which wasn't ideal for me.

Somehow I stumbled across [Netlify](https://www.netlify.com/). It lets me build, deploy and manage my blog automatically.

When I push my changes to my public [GitHub](https://github.com/cbillowes/curious-programmer-oxygen) repo, the Netlify hook detects the change and builds it automatically for me. With Gatsby's web sockets, the web pages refresh over time as changes are detected.

## Code quality
I am interested in knowing what the quality of my code is and found websites that verify it automatically on build.

I registered with both [Code Climate](https://codeclimate.com/github/cbillowes/curious-programmer-oxygen) and [Codacy](https://app.codacy.com/project/cbillowes/curious-programmer-oxygen/dashboard) to get these insights. After each deployment, I get a report telling me what standard my code is in. I seem to have some work to do 😉

---

I enjoy writing and sharing what I learn. My blogging platform makes this possible and I am proud of its outcome.

I hope that some of these technologies can be useful to you when developing a blog or any other website of your own. If you have any other technologies that you use, please share it with me.

---

## Resources
* [Jekyll](https://jekyllrb.com/)
* [Gatsby](https://www.gatsbyjs.org/)
* [GoDaddy](https://godaddy.com)
* [BlueHost](https://www.bluehost.com/)
* [Netlify](https://www.netlify.com/)
* [GitHub](https://github.com/)
* [Code Climate](https://codeclimate.com/)
* [Codacy](https://www.codacy.com/)