Answer: I figured it out. The follow-along is old and GraphQL API had an update. I had to go to their API Playground and re-do the code.
I am making a blog with Nextjs using hygraph.com as the back end. I was trying to get it to where you can see the posts when you click, and it suddenly stopped working on me. If you do need it, here is my entire code: https://github.com/DeviousWings/blog-app
I am using this follow-along for the program: https://www.youtube.com/watch?v=HYv55DhgTuA My mess-up seems to be at the 1:46:40 mark.
If you need more information, let me know, and I will put an "edit" in front.
Here is the error message:
Server Error
Error: [line: 1] field 'excerpt' is not defined in 'Post':
{"response":{"errors":[{"message":
"[line: 1] field 'excerpt' is not defined in 'Post'"}],
"data":null,"extensions":"requestId":"clgir0yw21ztz0blki9cm5z9o"},
"status":400,"headers":{}},"request":
query GetPostDetails($slug : String!) {
post(where: {slug: $slug}) {
author{
name
bio
photo {
url
}
}
createdAt
slug
title
excerpt
featuredImage {
url
}
categories {
name
slug
}
content {
raw
}
}
}
`;
",
"variables":{"slug":"space-cockpit"}}}
Here is the source of the mess up:
services\index.js (109:17) @ async getPostDetails
107 |
108 |
> 109 | const result = await request(graphqlAPI, query, { slug });
| ^
110 |
111 | return result.post;
112 | };
Here is the entire code where the source is located (blog-app\services\index.js):
import { request, gql } from "graphql-request";
const graphqlAPI = process.env.NEXT_PUBLIC_GRAPHCMS_ENDPOINT;
export const getPosts = async () => {
const query = gql
`query MyQuery {
postsConnection {
edges {
node {
author {
bio
name
id
photo {
url
}
}
createdAt
slug
title
exerpt
featuredImage {
url
}
categories {
name
slug
}
}
}
}
}
`;
const result = await request(graphqlAPI, query)
return result.postsConnection.edges;
};
export const getCategories = async () => {
const query = gql`
query GetGategories {
categories {
name
slug
}
}
`;
const result = await request(graphqlAPI, query);
return result.categories;
}
export const getRecentPosts = async () => {
const query = gql `
query GetPostDetails() {
posts(
orderBy: createdAt_ASC
last: 3
) {
title
featuredImage {
url
}
createdAt
slug
}
}
`
const result = await request(graphqlAPI, query)
return result.posts;
};
export const getPostDetails = async (slug) => {
const query = gql`
query GetPostDetails($slug : String!) {
post(where: {slug: $slug}) {
author{
name
bio
photo {
url
}
}
createdAt
slug
title
excerpt
featuredImage {
url
}
categories {
name
slug
}
content {
raw
}
}
}
`;
const result = await request(graphqlAPI, query, { slug });
return result.post;
};
export const getSimilarPosts = async (categories, slug) => {
const query = gql`
query GetPostDetails($slug: String!, $categories: [String!]) {
posts(
where: {slug_not: $slug, AND: {categories_some: {slug_in: $categories}}}
last: 3
) {
title
featuredImage {
url
}
createdAt
slug
}
}
`;
const result = await request(graphqlAPI, query, { slug, categories });
return result.posts;
};
My Models:
I am not good at debugging but my console.log did not pick up anything.
