Switch between REST and GraphQL in Next.js JSS apps

Version: 19.x

JSS Next.js applications can use either the Sitecore Layout Service REST API or the Sitecore GraphQL Edge schema to fetch layout and dictionary data.

You can change the data-fetching method after project creation by replacing the JSS services used by the application to interact with Sitecore APIs. Specifically, you need to change between REST and GraphQL services provided by the JSS Layout API and the JSS GraphQL API.

Switch from REST to GraphQL services

To switch the Next.js sample application from REST to GraphQL:

  1. Move or delete <src>/lib/dictionary-service-factory.ts and <src>/lib/layout-service-factory.ts .

  2. Download dictionary-service-factory.ts and layout-service-factory.ts to <src>/lib/.

Switch from GraphQL to REST services

To switch the Next.js sample application from GraphQL to REST:

  1. Move or delete <src>/lib/dictionary-service-factory.ts and <src>/lib/layout-service-factory.ts.

  2. Download dictionary-service-factory.rest.ts and layout-service-factory.rest.ts to <src>/lib/.

  3. Rename as dictionary-service-factory.ts and layout-service-factory.ts respectively.

Do you have some feedback for us?

If you have suggestions for improving this article,