GitHub recently released a feature that allows you to create a profile for your GitHub account, which is powered by a simple README.md file. As one might have guessed, people have already found ways to create creative profiles with dynamic content using APIs and GitHub Actions. In this quick tutorial, I will show you one way to dynamically display your tweets on your GitHub profile.
Before We Start
You will first need to enable the profile feature on your account by creating a new repo that matches your GitHub username. For example, my username is
StevenJDH so my repo is called
StevenJDH. Once done, you can quickly create a starter profile using the GitHub Profile README Generator tool to get the needed markdown as you see here:
Generating an RSS Feed Link
The approach being taken today requires an RSS feed link for your tweets, which Twitter does not provide. Fortunately, the Rss.app service can provide us with one. To get this link, do the following:
- From the Rss.app website, sign in or sign up with your Twitter account.
- Optional: If this is a new account, you will be automatically enrolled into the 7 day trial for the Premium tier. Downgrading later to the Free tier will undo the following steps unless you opt to pay for that tier. I recommend downgrading to the Free tier now to avoid a message like
[[Action required] Your RSS.app Trial has Expired - Sat Oct 31 2020](https://rss.app)replacing your tweets, and having to repeat the steps that follow.
- Select the
+ New Feedbutton on the left after logging in, and then choose the Twitter RSS Feed tile on the right.
- In the first field provided, enter the URL to your Twitter profile and click the
- You should now see your RSS feed link associated with your Twitter account. In trial mode, the data behind this link will refresh every 30 minutes for the first week, but afterward, it will refresh once a day.
Setting Up Your GitHub Profile README
Now for the fun part, adding the tweets to the GitHub profile. This is made possible thanks to the Blog Post Workflow that we are adapting to make it work for Twitter.
- Create a folder called
.githubat the root of your profile repo. Inside that folder, create another folder called
workflows. You should have something like this
- In the
workflowsfolder, create a file called
twitter-workflow.ymlwith the following contents along with your RSS feed link:
name: Latest Twitter Tweets on: schedule: # Runs once a day because using Free tier in Rss.app - cron: '0 0 * * *' workflow_dispatch: # Run workflow manually (without waiting for the cron to be called), through the Github Actions Workflow page directly. jobs: update-readme-with-twitter: name: Update this repo's README with latest tweets runs-on: ubuntu-latest steps: - uses: actions/checkout@v2 - uses: gautamkrishnar/blog-post-workflow@master with: comment_tag_name: "TWITTER" feed_list: "<<[[PLACE YOUR RSS FEED LINK HERE]]>>" commit_message: "Updated with the latest tweets" committer_username: "twitter-bot" committer_email: "firstname.lastname@example.org"
- Back at the root of your repo, add the following to your
README.mdfile where you want the tweets to appear:
### 📱 Latest Tweets <!-- TWITTER:START --> <!-- TWITTER:END -->
- Once everything is saved, you can manually trigger the GitHub action that will replace the above
Actionsat the top of your profile repo, select
Latest Twitter Tweetson the left under
Workflows, and then select
Run workflowon the right. Assuming enough time has passed for the Rss.app service to parse your tweets, you should see the last 5 tweets on your GitHub profile.
In theory, the Blog Post Workflow can support any RSS feed-based service, but it already has direct, out-the-box support for many popular services. It also provides tons of configuration options, which I used to adapt the output more for Twitter. Other than the Free tier service only parsing once a day, this approach works well, and it is compact. If you know of any other approaches that do not use cards, or has a better Free tier for parsing tweets, please share it in a comment.
Latest comments (2)
It works like a charm. Thanks for sharing
Thanks for this, it worked like a charm 🚀