Community Plugin
View plugin on GitHubgatsby-source-hashnode
Build Gatsby websites with Hashnode as a data source
Highlights
- Retrieves user posts
- Calculates estimated reading time
- Fetches user details
- Converts images for gatsby-plugin-image
- Supported versions
- Gatsby v4 (
@latesttag) - Gatsby v3 (
@release-2tag)
- Gatsby v4 (
Install
npm install gatsby-source-hashnodeHow to use
Configure the plugin in gatsby-config.js:
// gatsby-config.js
module.exports = {
plugins: [
{
resolve: "gatsby-source-hashnode",
options: {
username: "<HASHNODE_USERNAME>",
},
},
],
};How to query
Get user posts
{
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)
{
allHashNodePost {
edges {
node {
title
readingTime {
minutes # 2
text # "2 min read"
time # 120000
words # 100
}
}
}
}
}Get user details
{
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"
}
}
}
}