Next.js Discord

Discord Forum

How can I get my server-side page component to update dynamically on data update?

Unanswered
Northern Mockingbird posted this in #help-forum
Open in Discord
Northern MockingbirdOP
My page is very simple:
export default async function StorePage() {
  const storeItems = await client.fetch(
    `*[_type == "storeItem"] | order(_createdAt desc)`,
    {},
    { next: { tags: ['store-page'] } }
  );

  return (
    <div className="image-collection">...</div>
  );
}


As-is, when I update a storeItem I do not see the change on my page until I reset cache and hard refresh.
What can I add to this so that the page will show updates dynamically?

Thanks in advance

2 Replies

Philippine Crocodile
When you update/mutate the data in your CMS or wherever the data is stored, you will need to either call the revalidatePath(/****) or the revalidateTag() functions in order refresh the data
If you are updating the data inside the CMS itself you could have a webhook that calls an API route in your backend that can also use the revalidatePath or revalidateTag functions