Skip to main content

Command Palette

Search for a command to run...

How To Show Latest Hashnode Blog Posts In Github Profile Readme?

Published
β€’2 min read
How To Show Latest Hashnode Blog Posts In Github Profile Readme?
V

Crazy Developer From India, who has more interest in programming than a main stream academic!

I have been a hardcore open-source developer building plugins for WordPress and WooCommerce since 2007. It has been an amazing 13-year journey, and I look forward to more!

I ❀️ Open Source!

Hi There,

I recently decided to start my own blog using Hashnode. after setting up the blog I found out that there is no GitHub action which can update my Github Profile Readme with the latest posts I write here.

So I decided to jump into work and started to create a GitHub action that can do the job.


πŸŽ‰ Github Action For Hashnode Blogs πŸŽ‰

Using this action you will be able to display the latest posts from your account to your Github Profile Readme or Update it in a Github Gist which can be pinned to your profile later & it can render the latest posts data in multiple styles.

Setting up with Github Profile Readme

I assume that you already have created your Github Profile Readme

Step 1 :

Add the below content to your README.md file in Github Profile

## My Latest Blog Posts πŸ‘‡
<!-- HASHNODE_BLOG:START -->
<!-- HASHNODE_BLOG:END -->

https://s2.do-spaces.com/2020/Nov/05/1604579158-16.jpg

Step 2 :

Create blog.yml file inside of .github/workflows/ folder in your Github Profile Readme repository

name: "πŸ“š Blog Updater"

on:
  workflow_dispatch:
  schedule:
    - cron: '0 0 * * *' # Runs Every Day

jobs:
  update_blogs:
    name: "Update Blogs"
    runs-on: ubuntu-latest
    steps:
      - name: "πŸ“₯  Fetching Repository Contents"
        uses: actions/checkout@main

      - name: "πŸ“š  Hashnode Updater"
        uses: "varunsridharan/action-hashnode-blog@main"
        with:
          USERNAME: 'your-username'
          COUNT: 10
        env:
          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}

That's it now we have configured the workflow & README.md file. and the workflow is set to run once every day or when manually triggered.

now navigate to the Actions tab in that repository, select the workflow that we added and click RUN

How To Run Github Workflow Manually

Note

This action can be used with Gist or with any other repository For more information on this action please check the GitHub repository

J

This is an amazing action Varun Sridharan. Very simple to set up, no hassle. Just plug and play. I look forward to trying to implement my own version of this GitHub Action from scratch.

1
V

Thanks for checking out this action :-)

Waiting to try out your action :-)

1
S
Sudhir5y ago

Great work! I have tried this and it is amazing! Could you please help me or let me know how to create our own such workflow actions? I'm curious and I would like to have one of my own as you have one. Thank you!

1
V

Yes sure. I am already working on a blog for it.

2
S
Sudhir5y ago

Amazing!!☺️ Varun Sridharan

V

sudhir dontha We have started a Series about GitHub Actions This is a 6 part series that I will post 1 per day. for the next 5 days

#1 What is GitJub Action? https://blog.svarun.dev/what-is-github-action

2
S
Sudhir5y ago

Honestly, I really appreciate the effort in taking time and responding or commenting here to inform me!!

Thanks a lot for informing!!Varun Sridharan

D

Really nice! Just one question i configured it and now the blog posts points to https://danytulumidis.hashnode.dev/ but my blog is under danysdevcorner.hashnode.dev Do i missed something? Thank you very much in advance!

V

the post url is generated manually using your hashnode username. as there is no way to currently fetch the actual post url in hashnode.

1
D

alright thanks for the fast reply :) Varun Sridharan

B

Varun Sridharan Take the url of blog as an additional option along with username.

V

Bhanu Teja Pachipulusu Yes, I did the same. some users reported that url was not generating properly. so i decided to BLOG_URL input as optional where they can override it.

Dany Tulumidis Please do add BLOG_URL in your workflow file and run it. it should fix the issue.

2
D

Yes it worked, many thanks!Varun Sridharan

1
U

WoW! I just added it using this action! I did not know I could also do that! Thank you so much Varun! πŸ’™

1
B

Nice article.

Even I have setup Github profile to show the latest blog posts from @hashnode. I use a different action.

name: Latest blog post workflow
on:
  schedule:
    # Runs every hour
    - cron: '0 * * * *'

jobs:
  update-readme-with-blog:
    name: Update this repo's README with latest blog posts
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v2
      - uses: gautamkrishnar/blog-post-workflow@master
        with:
          feed_list: "https://blog.bhanuteja.dev/rss.xml"

blog-post-workflow.yml

This works based on rss feed and you can add as many feeds as you want in this.

2
V

That's great. I was not aware of that action :-)

2
B

Your action seems to also have layouts for showing blog posts. The one I mentioned doesn't have that.

1
R

Nice, was difficult but made it.

S

It's awesome! Tyring it right now.😍

S

One quick question. Should we do anything after step 2. There are many other files in your repo other than blog.yml.

V

Sai Laasya Vabilisetty

It requires only 2 steps to configure. you can look at my YAML file to get an idea

https://github.com/varunsridharan/varunsridharan/blob/main/.github/workflows/blog.yml

But this action dose provide different layouts . which you can find at https://github.com/varunsridharan/demo-action-hashnode-blog

And each *.md provides the action code which you can use to get that layout.

2
S

Okay thanks I will check Varun Sridharan

S

Awesome!

V

Thanks :-)

More from this blog

V

VS Writings

31 posts

Crazy Developer From India, who has more interest in programming than a main stream academic!

I ❀️ Open Source!