Next.js server Side Rendering

Question

I need help regarding next.js SSR. I'm new to next.js and building an e-commerce store. where i want to fetch navigation menu on server side so its available as soon as page load. don't want to fetch on client side. one way is to fetch navigation on each page using getStaticProps and pass as a prop to component. but I don't want to use this approach. instead I want to fetch it once and share between multiple pages.

I'll appreciate your responses Thank You.

I tried using getStaticProps on every page

Answer 1

What about wrapping the app in a "Layout" component?

This is a common approach.

So you would have the _app.js file wrapped by a wrapper component.

And that wrapper component has the getStaticProps.