I am using GatsbyJS to develop a website, i used a plugin gatsby-source-medium
to query medium so i can get posts and no matter what i do, it always returns 3 items.
my query:
query MyQuery {
allMediumPost(limit: 100000) {
nodes {
id
createdAt
}
}
}
response:
{
"data": {
"allMediumPost": {
"nodes": [
{
"id": "8238affb-bcf6-5867-a45c-c5483b3a2225",
"createdAt": "2023-12-03"
},
{
"id": "2acbcb1d-e436-541d-b627-35feaae4db0c",
"createdAt": "2023-10-28"
},
{
"id": "0c0797bb-ab94-532c-87f1-945f2e874dd8",
"createdAt": "2023-10-28"
}
]
}
},
"extensions": {}
}
I have tried using rss and axios, but it doesn't return the thumbnail and its causing some part of the site to break.
I also increased the limit.
is there something i am missing?
Try another solution using the RSS feed.
Install the gatsby-source-rss-feed
dependency (I'm using version 1.2.2).
Configure the package, pointing it to the RSS feed.
🗎 gatsby-config.js
module.exports = {
siteMetadata: {
// Site stuff goes here.
},
plugins: [
{
resolve: `gatsby-source-rss-feed`,
options: {
url: `https://medium.com/feed/@desciafrica`,
name: "RSS",
}
},
],
}
You'll have new content in GraphQL which you can use to access the RSS data.
🗎 src/pages/home.js
import React from "react"
import { graphql } from "gatsby"
import Layout from "../layouts"
export default function Index({ data }) {
return (
<Layout>
<p>List of RSS posts:</p>
<ul>
{data.allFeedRss.nodes.map((node) => (
<li>
<a href={node.link}><strong>{node.title}</strong></a>
</li>
))}
</ul>
</Layout>
)
}
export const pageQuery = graphql`
query {
allFeedRss {
nodes {
id
link
title
}
}
}
`
That will pull through the most recent ten posts from the feed (in the correct order!).