Next.js Discord

Discord Forum

can we use ssg in app router?

Unanswered
codecret posted this in #help-forum
Open in Discord
codecretOP
I'm using ssg in app router but this error is appearing 
"getStaticProps" is not supported in app/. Read more: 


export default function Page({ products }) {
  return (
    <main>
      <div className={styles.coverDiv}>
        <Image className={styles.heroImg} src="/cover.png" alt="Logo" fill />
      </div>
      <FirstSectionsProduct
        sectionTitle={"Products For You"}
        products={products}
      />
    </main>
  );
}
// getStaticProps to fetch data at build time
export async function getStaticProps() {
  const res = await fetch("http://localhost:3000/api/products");
  const productsData = await res.json();

  const products = productsData;

  return {
    props: {
      products,
    },
  };
}

11 Replies

codecretOP
export default function Page({ params }) {
  const { name } = params;
  console.log("page");
  console.log("name", name);

  return (
    <main>
      <div className={styles.coverDiv}>
        <Image className={styles.heroImg} src="/cover.png" alt="Logo" fill />
      </div>
      <FirstSectionsProduct
        sectionTitle={"Products For You"}
        products={productsData}
        // products={slug}
      />
    </main>
  );
}

export async function generateStaticParams() {
  const products = await fetch("http://localhost:3000/api/products").then(
    (res) => res.json()
  );
  console.log("products", products);

  return products.map((product) => ({
    name: product.name,
  }));
}


it' s not fetching correctly i'm not sure why
Netherland Dwarf
No
You cant
codecretOP
as i understand generateStaticParams can be used when view single product?
Netherland Dwarf
It can be used in pages router
codecretOP
but i should use app rotuer as it is the newest thing right?
Netherland Dwarf
Oh sorry your talking about getStatisParams
I though like getServerSideProps
codecretOP
no worries ! i'm talking about ssg (when i use getStaticProps)
i want to create landing page which has some products that may not be updated frequently and i'm thinking about good way to do it along with products page ,view single products and so on ( i asked this before)
codecretOP
so with nextjs imma do it on server or in client side , only two options ?