Publishing your blog articles via GitHub is amazing 😄

As a developer it will catch every developers attention that they can post to there blog directly with git push

You can now use your favourite IDE such as VSCode to directly make a blog post! Isn't it cool?

Steps to post articles via GitHub on Hashnode

1. Hashnode account:

If you don't have Hashnode account create one (affiliate link)

2. Create an empty repository on GitHub

Create a repo on GitHub that we will be used to save all you new posts like a normal GitHub repo

3. Connect Hashnode with Your GitHub

You need to goto you Blog Setting on hashnode and to inegrations

Blog Home -> Blog Dashboard -> Integrations -> Connect To GitHub

4. Allow Hashnode App on GitHub

You need to authorize HashNode App on GitHub and under repository select Newly Created Repository and click on Install

Now you have successfully intalled a.k.a connected to GitHub and 1 step behind publishing via VSCode

5. Clone your repo

git clone https://github.com/example/your-repo.git

Open your repo in VSCode or any other IDE you like and create new .md file (example.md, name of the file doesn't matter)

You need to keep this thing in mind that with every post you have to create a new .md file containing exactly below details a as metadata that will help hashnode to get title, imgae, tags etc. (You git the idea)😊

---title: GitHub Test
slug: github-test
tags: Test, GitHub
cover: https://cdn.isalman.dev/photos/1.jpeg
domain: blog.isalman.dev
---

Note: I have used my domain name on which I have hosted hashnode, you can replace it by your own

Now all you have to do is commit and push to your repo and hashnode will automatically post to your hashnode blog.

Also if you have to edit your post you can't do it from hashnode, you have to edit from you GitHub repo (That looks weird but it makes sense, bcuz both of them will store same version of your post!)

Some Tips:

Since you have to use markdown syntax you can use few extensions on VSCode to WYSIWYG editor to speed up 🚀 publishing time and have a visual experience

Name: Markdown Editor Id: zaaack.markdown-editor Description: A full-featured WYSIWYG editor for markdown. Version: 0.1.10 Publisher: zaaack VS Marketplace Link: https://marketplace.visualstudio.com/items?itemName=zaaack.markdown-editor

or if you don't want any extensions VSCode has a built-in .md previewer, all you have to do is press ctrl+shift+v from any .md file.

Thanks, See you in next blog post, (PS: I have published this blog post from VSCode 😊)