“Unlock the Future of Web Development: Discover the Hidden Powers of Headless WordPress!”
We can create a new file at src/lib/graphql.ts.
Any query you need can be added and exported from this file. The IDE inside the WPGraphQL admin page is a great place to experiment and write new queries. Let’s add one to fetch all our posts for now:
import { GraphQLClient } from 'graphql-request';
import { WORDPRESS_API_URL } from '../consts';
// Create a GraphQL client instance
export const graphQLClient = new GraphQLClient(WORDPRESS_API_URL);
// Query to get a list of posts
export const GET_POSTS = `
query GetPosts($first: Int, $after: String) {
posts(first: $first, after: $after) {
pageInfo {
hasNextPage
endCursor
}
nodes {
id
slug
title
date
excerpt
featuredImage {
node {
sourceUrl
altText
}
}
}
}
}
`;
Using the fetched data in our frontend
In Astro, we’re opting for a static build. Because of this, we must tell it which pages to build for us.
Post Comment