I have a Layout component that wraps everything in _app.js. That Layout component has data that I want to set at build time (the list of component pages). This is a standard pattern, to have an external data source determine navigation data (nav data).
Since components can't use getStaticProps() like Next.js pages... I am having Next.js pages fetch the nav data through getStaticProps() and then pass that nav data to the Layout component through a global Layout context.
But that still doesn't solve the problem, because that means every page needs to fetch nav data.
I don't get it. How do you populate a layout component with remote data at build time for statically generated pages? Or, even if nav data is set client-side, how do you dependably get that remote data?
Side note, rendering nav data client-side wouldn't be the end of the world for the page's SEO. Also, I think Next.js will pre-fetch any page that linked from anywhere in the current viewport, regardless of if that part of the page was statically generated or not.
Side side note, when authenticated using a Next.js app, you could easily share nav data in the user's session endpoint, to render navigation items client-side, especially if those navigation items are specific to that user.
I have a Layout component that wraps everything in
_app.js. That Layout component has data that I want to set at build time (the list of component pages). This is a standard pattern, to have an external data source determine navigation data (nav data).Since components can't use
getStaticProps()like Next.js pages... I am having Next.js pages fetch the nav data throughgetStaticProps()and then pass that nav data to the Layout component through a global Layout context.But that still doesn't solve the problem, because that means every page needs to fetch nav data.
I don't get it. How do you populate a layout component with remote data at build time for statically generated pages? Or, even if nav data is set client-side, how do you dependably get that remote data?
Side note, rendering nav data client-side wouldn't be the end of the world for the page's SEO. Also, I think Next.js will pre-fetch any page that linked from anywhere in the current viewport, regardless of if that part of the page was statically generated or not.
Side side note, when authenticated using a Next.js app, you could easily share nav data in the user's session endpoint, to render navigation items client-side, especially if those navigation items are specific to that user.