Building a markdown blog

Context

I have been using OneNote to collect technical notes and Blogspot.com for blogging. The idea of combining both of them has been bugging my mind since the day I was introduced to Github Pages.

So the idea was to build a static website, where I can keep my notes.

Checklist ✓

1. Markdown 🗒

Considering the content lock-in I've experienced while using Blogspot. I decided to use markdown files for the post content.

2. GatsbyJs 🤩

ReactJs based static site generator with a huge user community and a great number of plugins.
Very awesome markdown support 👍

3. Netlify 🙌

The obvious choice in comparison to Github-Pages for the ease of convenience.

Tutorial Series

In this series, we will

• start by

  • setting up a basic markdown blog without worrying about the looks.

• then

  • deploy our blog to Netlify.

• at last,

  • focus on enhancing the looks. [never ending process...]

Get Set, Go! 🚀

In this series, I'll write about each step in the journey of building this blog.

Below are the steps, which have been implemented on this site

1. The Setup
2. Markdown
3. Site Configuration
4. GraphiQL
5. Blog Post List
6. Blog Post Template
7. Minimal layout using Tailwind
8. Restructure index page
9. Fix images not rendering
10. Enable Gatsby incremental builds in Netlify
11. Fix webpage title and favicon
12. Adding a Header
13. PostCSS Import
14. Theming with tailwind
15. Firebase Analytics

upcoming

• Use tags
• Code Syntax Highlighting
• 404 Page
• Heading Links
• & much more stuff

---

FYI, I am posting updates in this Twitter thread.