Discussion on importing a link from a database to a project using Next.js and client.fetch

// A very useful library 😉
import { groq } from "next-sanity";


// this 👇 is your page
function Blog({ posts }) {
  return (
    <ul>
      {posts.map((post) => (
        <li>{post.title}</li>
      ))}
    </ul>
  )
}

// This function gets called at build time on server-side.
// It won't be called on client-side, so you can even do
// direct database queries.

// This is your data fetching 👇
export async function getStaticProps() {

  // You would use groq here to get your sanity data
  const res = await fetch(YOUR_QUERY)
  const posts = await res.json()

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

export default Blog