Build and Deploy THE BEST Modern Blog App with React | GraphQL, NextJS, Tailwind CSS
Why Stack Overflow recommends it
Stack Overflow users cite it as the tutorial they were following when they hit errors, such as missing GraphQL fields, getStaticPaths slug problems or Next.js Image styling, because the course code has aged.
Recommended by 1 people across 1 different months, 2021 to 2023.
What it is
A 3 hour 10 minute follow-along tutorial from JavaScript Mastery that builds a headless-CMS blog app with React, Next.js, Tailwind CSS, GraphQL and GraphCMS. It covers featured and recent posts, categories, markdown content, author info and comments, then deploys the finished site.
What people said
Recommends Carlos Henrique R. Pereira · 2023-07 · Stack Overflow · on “How can I implement the Hyperlink on this code?”
Theres a lot of information behind this problem. I'll try to show everything here. I'm using Hygraph and GraphQL to create a Blog with Headless CMS and on my API call I have the getPostDetails. This is working and my problem is related to content { raw }. export const getPostDetails = async (slug) => { const query = gql` query GetPostDetails($slug: String!) { post(where: {slug: $slug}) { title excerpt featuredImage { url } author{ name bio photo { url } } createdAt slug content { raw } categories { name slug } } } `; const result = await request(graphqlAPI, query, { slug }); return result.post; }; I needed to create a way to render all the nodes the hygraph provides when you create a text. S
Cites Ori · 2021-12 · Stack Overflow · on “Error: A required parameter (Slug) was not provided as a string in getStaticPaths for /post/[Slug]”
hey I start a tutorial on Build and Deploy THE BEST Modern Blog App with React | GraphQL, NextJS, Tailwind CSS [this video] and it shows me this error I don't know how to fix it and it shows me only when I try to enter post this is the error : Error: A required parameter (Slug) was not provided as a string in getStaticPaths for /post/[Slug] this is the code : import React from 'react'; import { useRouter } from 'next/router'; import { PostDetail, Categories, PostWidget, Author, Comments, CommentsForm, Loader } from '../../components'; import { getPosts, getPostDetails } from '../../services'; const PostDetails = ({post}) => { console.log({post}); if (router.isFallback) { return <Loader />; } retu
Cites Paul Davis · 2022-11 · Stack Overflow · on “Issues formatting <Image /> in Next.js with tailwind”
I am following a tutorial creating a blog site. I am running into an issue with an <Image /> formatting it in Next.js I have followed everything in the video, but it is a year old so I am assuming some things have changed. The video: [this video] I am working at timestamp 2:05:54 How it should look: [LINK] How mine looks (info blacked out): [LINK] My code: ` import React from 'react' import Image from 'next/image' const Author = ({ author }) => { return ( <div className='text-center mt-20 mb-8 p-12 relative rounded-lg bg-black bg-opacity-20'> <div className='absolute left-0 right-0 -top-14'> <Image alt={author.name} unoptimized height='100' width='100' layout='fill' className='align-middle rounde
Cites Devious · 2023-04 · Stack Overflow · on “Problem sending a post 'excerpt is not defined in 'post'”
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: [LINK] I am using this follow-along for the program: [this video] 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' i