NextJS issue with SSR and CSR

57 views Asked by At

I am new to NextJS, I am building a simple e-commerce website.

I'm having Commons API (Which returns the logo, title, bg color) of the website to be fetched at index.tsx, also having the latest 20 products to be fetched in homepage (index.tsx) too.

When the user navigates from Homepage -> Single product page, NextJS currently fetches the Commons API again (using getServerSideProps), along with the Single Product API (using getServerSideProps).

I want to eliminate that extra API call for (Commons API) because the data is already loaded in the browser, and the navigation has been made in client side.

But I want to keep the same functionality when the user refreshs the browser or access the single product link directly.

Please check the attached diagram that i want to implement. Is that possible with NextJS or the data should be fetched from server on each time the user navigates to another page?

Diagram of what needs to be implemented

0

There are 0 answers