Member-only story
Gatsby.js — Site and Post Queries
Gatsby is a static web site framework that’s based on React.
We can use it to create static websites from external data sources and more.
In this article, we’ll look at how to create a site with Gatsby.
Excerpt
We can get post excerpts from GraphQL queries.
To do this, we write:
{
allMarkdownRemark(filter: {frontmatter: {date: {ne: null}}}, limit: 5) {
edges {
node {
frontmatter {
title
}
excerpt(format: PLAIN, pruneLength: 200, truncate: true)
}
}
}
}
We add the excerpt
function with the format
, pruneLength
, and truncate
parameters.
format
has the excerpt format.
pruneLength
is the max length of the excerpt.
truncate
indicates that we want to truncate the excerpt to the given length.
Sort, Filter, Limit, and Format Together
We can combine sort, filter, limit, and format together.
For instance, we can write:
{
allMarkdownRemark(limit: 3, filter: {frontmatter: {date: {ne: null}}}, sort: {fields: [frontmatter___date], order: DESC}) {
edges {
node {…