DEV Community

Cover image for How do you add Medium or Dev.to articles to your GitHub Profile?
Ahmet Kaptan
Ahmet Kaptan

Posted on

How do you add Medium or Dev.to articles to your GitHub Profile?

Hello folks, 2 days ago, I asked myself, “How can I add Medium articles to my GitHub Profile?” So I googled it and found some articles. I read them, and the articles provided some repositories, but the projects are outdated and don’t work. I decided to create an open-source project for this. We can call an API to get an article as a responsive SVG and showcase it on our GitHub profiles.

The Repo

The source of Medium and Dev.to articles
I use the API:

https://api.rss2json.com/v1/api.json?rss_url=https://medium.com/feed/#{@the_medium_username}")

https://api.rss2json.com/v1/api.json?rss_url=https://dev.to/feed/#{@the_medium_username}

The API gives the user’s latest 10 articles. So that is it. We already have data.

Medium Snippet API

I have been using Ruby on Rails in the project. The Medium Snippet API allows users to retrieve and display the latest 10 Medium or Dev.to articles for a given username. Users can add these articles to their GitHub profiles by providing the username and index parameters.

I am currently maintaining it and there are to-dos.
Like:

  • Update snippet card style
  • Add a new style for white mode theme

The API finds articles from the username with this link:

https://medium-snippet-dc633c4f39a0.herokuapp.com/api/article.svg?username=@codescaptain&index=0&source=medium

https://medium-snippet-dc633c4f39a0.herokuapp.com/api/article.svg?username=@codescaptain&index=0&source=dev_to
Enter fullscreen mode Exit fullscreen mode
  • username: your medium or dev.to username/profile
  • index: your recent article index. e.g.: 0 means your latest article.

Example Medium

Code:

[![My Medium story](@codescaptain&index=1)](#)">https://medium-snippet-dc633c4f39a0.herokuapp.com/api/article.svg?username=@codescaptain&index=1)](#)
[![My Medium story](@codescaptain&index=0)](#)">https://medium-snippet-dc633c4f39a0.herokuapp.com/api/article.svg?username=@codescaptain&index=0)](#)
Enter fullscreen mode Exit fullscreen mode

Output(the article has been changing depending index):

Image description

Contact
For inquiries, you can reach out through my GitHub Profile.

Top comments (0)