Having trouble with the API part of Next.js

[Montusker]

https://stackoverflow.com/q/60660488/13049359

[timneutkens]

You can read my reply here: #9524 (comment)

[Montusker]

Thanks for the quick reply!

I'm having a little trouble getting it to work still. Specifically two separate errors.

import fetch from 'node-fetch'
import Layout from "../components/Layout";
import {getData} from "./api/get-shopworks.js";


function createCard(work) {
  return (
    <Card
      key={work.id}
      id={work.id}
      path={work.path}
      size={work.size}
      price={work.price}
      sold={work.sold}
    />
  );
}



export default function Shop({artwork}) {
  return (
    <Layout title="Shop">
      <p>This is the Shop page</p>

        {artwork.map(createCard)}
    </Layout>
  );
}

export async function getStaticProps() {
  // Call an external API endpoint to get posts.
  const artwork = await getData()

  // By returning { props: posts }, the Blog component
  // will receive `posts` as a prop at build time
  return {
    props: {
      artwork,
    },
  }
}

Which is giving me "ReferenceError: getData is not defined"

And in the api/get-shopworks file

const mongoose = require("mongoose");



mongoose.connect('mongodb://localhost:27017/ArtDB', {
  useNewUrlParser: true,
  useUnifiedTopology: true,
  useFindAndModify: false
});

const itemsSchema = {
  id: String,
  description: String,
  path: String,
  size: String,
  price: Number,
  sold: Boolean
};
const Art = mongoose.model("Art", itemsSchema);

export async function getData() {
    const myData = await Art.find({sold: false}, (err, foundItems)=> {
  if (err) {
    console.log(err);
  } else {
    console.log(foundItems);
  }
  });
return myData;
}

export default (req, res) => {
  const myData = await getData()
  res.json(myData)
}

Is giving me an Internal Server Error

SyntaxError: C:\Users\Joe\Desktop\demo-react-stripe-js\pages\api\get-artwork.js: Can not use keyword 'await' outside an async function (46:17)

  44 | 
  45 | export default (req, res) => {
> 46 |   const myData = await getData()
     |                  ^
  47 |   res.json(myData)
  48 | }```

[waptik]

// api/get-shopworks.js
export async default(req, res){
...
}

// Shop.js
export default function Shop({artwork}) {
  return (
    <Layout title="Shop">
      <p>This is the Shop page</p>

        {artwork.map(art => createCard(art))}
    </Layout>
  );
}