Adding a list of my Hashnode posts to my personal website.

About me
Hey reader! My name is Marcus Weinberger, and I'm just getting started with Hashnode. While I'm mainly a Python developer, I work with HTML and such for my frontends. Click here to see more about me!

So, my personal website is a bit lame. Actually, I would say it's very lame. I don't really do front-end.

An old snapshot of my personal website -

Why the update?

After starting yet another additional blog, I thought it would be a nice way to drive traffic to it if I added a feed of my posts to my personal website. On a sidenote, I don't know why I insisted on writing all my previous blogs from scratch. Moving to Hashnode is looking like a good idea.

Well, the back-end of my website is built with Python, so let's use that to query the Hashnode API. I followed a tutorial which I will link below, and customized it a little, before making a little wrapper for it.


Python code

import requests

class Hashnode(object):
    _api_url = ''

    def __init__(self, api_key: str):
        self.headers = {
            'Authorization': api_key

    def get_user_posts(self, username: str, page: int = 0) -> (str, list):
        Accepts a str username as input.
        Returns the blog domain (str), and a list of posts (dicts)
        query = '''{
  user(username: "<username>") {
    publication {
      posts(page: <page>) {
}'''.replace('<username>', username).replace('<page>', str(page))
        req =, json={'query': query}, headers=self.headers)
        res = req.json()['data']['user']
        return res['publicationDomain'], res['publication']['posts']

Using this, I added the following snippet to my Flask template

<div id='posts'>
    <!-- Loop through posts -->
    {% for post in posts %}
    <div class='post'>
        <h3>{{ post.title }}</h3>
        <p>{{ post.brief }}</p>
        {% if post.coverImage %}
        <img src='{{ post.coverImage }}' alt='Cover Image'>
        {% endif %}
        <a href='{{ blogDomain }}/{{ post.slug }}'>Read more</a>
    {% endfor %}

With some CSS (generated by ChatGPT to fit the rest of my website), it fit right in.

The results

Check out the live site here!

Updated result

Did you find this article valuable?

Support Marcus Weinberger by becoming a sponsor. Any amount is appreciated!