How do you implement a multisite setup with Sitecore and Next.js, with a Sitecore First Approach? Do we need to create separate Next.js apps for each site or we can we configure it in the same default Next.js app? Which one is the preferred?
1 Answer
This depends entirely on your requirements.
- Separate applications would enable you to develop, deploy, and scale sites independently. Components and other code could be shared via npm packages.
- A shared, multi-site application could save cost via easier deployment and less infrastructure.
Next.js can now support multi-site applications in the same "rendering host" for both SSG (getStaticProps
) and SSR (getServerSideProps
).
- For SSG, as of Next.js 12 you can use middleware to map that host name to a Sitecore site name, and alter the incoming URL path to a page route which includes the site name as a route parameter. That site name could then be passed to the Layout Service. Example here.
- For SSR, you can find the current host name in
req.headers.host
and map it to a Sitecore site name, which you pass to the Layout Service. Example here.
-
thanks, but do we need separate rendering host for each site?– ganeshCommented Nov 19, 2021 at 16:24
-
@Sam It is not required, no. Application = Rendering Host, updated my answer to reflect this Commented Nov 19, 2021 at 17:00
-
@nickwesslman thanks, while passing sc_sitename to layout service I am facing problem. Shall i need to pass this to 'SitecorePagePropsFactory' constructor which initialize layout service and dictionary service? for e.g as below this.layoutService = new RestLayoutService({ apiHost: config.sitecoreApiHost, apiKey: config.sitecoreApiKey, siteName: config.jssAppName, });– ganeshCommented Nov 26, 2021 at 13:47
-
@Sam this seems like a new question. Hard to read or answer via comment. Commented Nov 26, 2021 at 19:40
-
I asked new one could you please answer or give me some pointers on this. sitecore.stackexchange.com/questions/30342/…– ganeshCommented Nov 27, 2021 at 5:04