https://github.com/nitzano/gatsby-source-hashnode

Gatsby source plugin for building websites using Hashnode API as data source
https://github.com/nitzano/gatsby-source-hashnode

gatsby gatsby-plugin hashnode

Last synced: 11 months ago
JSON representation

Gatsby source plugin for building websites using Hashnode API as data source

• Host: GitHub
• URL: https://github.com/nitzano/gatsby-source-hashnode
• Owner: nitzano
• License: mit
• Created: 2020-12-28T18:51:36.000Z (about 5 years ago)
• Default Branch: master
• Last Pushed: 2023-03-01T15:59:38.000Z (almost 3 years ago)
• Last Synced: 2025-04-12T15:11:30.773Z (11 months ago)
• Topics: gatsby, gatsby-plugin, hashnode
• Language: JavaScript
• Homepage:
• Size: 3.04 MB
• Stars: 4
• Watchers: 1
• Forks: 2
• Open Issues: 13
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

          
gatsby-source-hashnode



Build Gatsby websites with Hashnode as a data source  





[![npm](https://img.shields.io/npm/v/gatsby-source-hashnode)](https://www.npmjs.com/package/gatsby-source-hashnode)

[![npm-beta](https://img.shields.io/npm/v/gatsby-source-hashnode/beta)](https://www.npmjs.com/package/gatsby-source-hashnode)

![npm-total](https://img.shields.io/npm/dt/gatsby-source-hashnode)

![GitHub Repo stars](https://img.shields.io/github/stars/nitzano/gatsby-source-hashnode?style=flat)

[![semantic-release](https://img.shields.io/badge/%20%20%F0%9F%93%A6%F0%9F%9A%80-semantic--release-e10079.svg)](https://github.com/semantic-release/semantic-release)

[![Commitizen friendly](https://img.shields.io/badge/commitizen-friendly-brightgreen.svg)](http://commitizen.github.io/cz-cli/)



- [Highlights](#highlights)

- [Install](#install)

- [How to use](#how-to-use)

- [How to query](#how-to-query)

  - [Get user posts](#get-user-posts)

  - [Get post's reading time](#get-posts-reading-time)

  - [Get user details](#get-user-details)

## Highlights

- Retrieves user posts

- Calculates estimated reading time

- Fetches user details

- Converts images for [gatsby-plugin-image](https://www.gatsbyjs.com/plugins/gatsby-plugin-image/)

- Supported versions

  - Gatsby v4 ( `@latest` tag)

  - Gatsby v3 (`@release-2` tag)

## Install

![release workflow](https://github.com/nitzano/gatsby-source-hashnode/actions/workflows/release.yml/badge.svg)

![test workflow](https://github.com/nitzano/gatsby-source-hashnode/actions/workflows/test.yml/badge.svg)

```bash

npm install gatsby-source-hashnode

```

## How to use

Configure the plugin in `gatsby-config.js`:

```javascript

// gatsby-config.js

module.exports = {

  plugins: [

    {

      resolve: "gatsby-source-hashnode",

      options: {

        username: "",

      },

    },

  ],

};

```

## How to query

### Get user posts

```graphql

{

  allHashNodePost {

    edges {

      node {

        brief # "In this article..."

        coverImage {

          # File node (to be used with gatsby-plugin-image)

          childImageSharp {

            gatsbyImageData(layout: FULL_WIDTH, placeholder: BLURRED)

          }

          # OR

          # url // "https://cdn.hashnode.com/...

        }

        slug # "my-great-article"

        title # "My Great Article"

      }

    }

  }

}

```

### Get post's reading time

(With the kind help of [reading-time](https://www.npmjs.com/package/reading-time))

```graphql

{

  allHashNodePost {

    edges {

      node {

        title

        readingTime {

          minutes # 2

          text # "2 min read"

          time # 120000

          words # 100

        }

      }

    }

  }

}

```

### Get user details

```graphql

{

  allHashNodeUser {

    edges {

      node {

        _id

        blogHandle # "userhandle1"

        coverImage # "https:/...

        dateJoined # "2014-01-01T01:00:00.000Z"

        isDeactivated # false

        isEvangelist # true

        location # "Canada"

        name # "First last"

        numFollowers # 503

        numFollowing # 14

        numPosts # 50

        numReactions # 95

        photo # "https:/...

        publicationDomain # "blog.mydomain.."

        tagline # "I do stuff"

        username # "username1"

      }

    }

  }

}

```