back to all posts

My Coding Blog From Scratch Using Gatsby and MDX - 1

by Nabendu Biswas / February 15th, 2020

#gatsby #react #javascript
Series: Gatsby-mdx

As many of my wonderful readers might know, that i really got success in with by blog post with the wonderful site of

I had also recently given five udemy courses to five people as i reached 100K views on

I already have a personal blog site and i had already described the way to create it in. my earlier blog series here.

But i want to create something like and initially the basic version, where people can cross post their dev, personal blog. The people at also encourages the same and open-sourced their platform.

About devAbout dev

One of the main features which attracted me to this site is the ease with which the writers can publish their post and give Canonical links. For those who don’t know canonical links are very important for google. It tell google which is the original source of article. Now i post on medium, personal blog and dev and always give canonical link of my personal blog. This is very important or else google will think you had copied your article from somewhere.

Easy canonical linkEasy canonical link

But if they had open-sourced then why do i want to recreate it. The site is built on React frontend and Ruby or rails on the backend with PostgreSQL. Now, i know good bit of React but not Ruby or rails.

I could make it in MERN stack, but for the last 6 months i had built some amazing production open-sourced sites using GatsbyJS. You can create a blog site by using only markdown files, which is amazing. You can add authentication to a Gatsby site. You can create a ecommerce site, which i will create soon to sell my upcoming Gatsby book :).

Enough of talking, let’s get’s started with the requirement first. The first version of the web-app will contain the following.

  • Create the home page similar to with adding the thing which i want like a navigation in top menu even for non-logged in users.

  • The blogs to expand the whole page like medium, which are easy to read.

  • All blogs to have tags, which can be used to get all similar blogs.

  • A search capability to search all blogs.

  • Authentication with email or gmail.

  • Authors dashboard with basic feature to upload a markdown file, featured image, canonical link and predefined tags(mostly coding and devlife).

I will start coding from the next part, but this is a very serious project for me and i will promise something which i will always keep.

  • This project will be completely open-source and every commit will be explained in this blog series.

  • All your credentials will be completely safe with us and never shared with anyone.

  • This site will be completely Advertisement free and free from any malicious scripts.

  • There will be other part in the site in future like podcast, videos(youtube) where you can share link to your podcasts and free youtube videos.

I have also done some domain hunting and finally purchased the

So, this site will be called The WebDev, because as most of you might know that today “Web is everything and everything is web”.

My journey for the site starts with the next part.

Nabendu Biswas