Create a food ordering app with Strapi and Next.js (3)

This tutorial is part of the « Cooking a Deliveroo clone with Next.js (React), GraphQL, Strapi and Stripe » tutorial series.


This is a companion discussion topic for the original entry at https://strapi.io/blog/nextjs-react-hooks-strapi-dishes-3

Why use express, instead of using Next to handle such routes ? Just create a file called [id].js inside your /restaurants/ folder, and you’ll be able to handle URIs in the form of /restraurants/

It seems like such an over-complexification for something that is built-in Next.

1 Like

Right, this tutorial uses NextJS 9 by default, very outdated already.

I followed the instructions to the letter but I was not able to display dishes , I got error of createHttpLink.js:116 POST http://127.0.0.1:1337/graphql 400 (Bad Request).
anybody can help?
thank you

Its because the GraphQL query is wrong.

Its using priceInCents instead of price.

It should be

const GET_RESTAURANT_DISHES = gql`
  query ($id: ID!) {
    restaurant(id: $id) {
      data {
        id
        attributes {
          name
          dishes {
            data {
              id
              attributes {
                name
                description
                price
                image {
                  data {
                    attributes {
                      url
                    }
                  }
                }
              }
            }
          }
        }
      }
    }
  }
`;

Youll also have to change the code down where it uses the attribute to this <h2>${centsToDollars(data.attributes.price)}</h2>

1 Like