Sitecore XM Cloud has enabled front-end developers to quickly start developing applications. There are various ways for front-end developers to get started and connect to content endpoints to develop applications. From the recent conference, I learned that Sitecore is still working on enabling front-end developers as true first-class citizens.
In this blog post, I am providing various options for the front-end developers.
- Using Local XM Cloud - a.k.a Full Stack XM Cloud Local Development
In this case, the Sitecore XM Cloud local environment should be set up on the developer's machine and will be used to serve the content for the front-end app.
Setting up the full-stack XM Cloud local development environment can be referenced here.
Be default, XM Cloud local development environment has the following environment key values.
API Key: Item ID of /sitecore/system/Settings/Services/API Keys/xmcloudpreview
GraphQL Endpoint: https://xmcloudcm.localhost/sitecore/api/graph/edge (where xmcloudcm.localhost is the host name for the local CM environment)
- In order to setup full-stack XM Cloud local development environment, developer needs a Windows machine to setup Sitecore.
- Developer has full control on the Sitecore content. They can play around with content as it is not going to impact any other users. - Using XM Cloud CM - a.k.a Edge Preview
In this case, Sitecore XM Cloud CM environment can serve the content for the front-end app.
API Key: Item ID of /sitecore/system/Settings/Services/API Keys/xmcloudpreview. You can also retrieve the Edge Preview API Key from the XM Cloud deploy app. Go to your XM Cloud project in Deploy app --> Details --> Edge Preview GraphQL IDE (CM) --> Generate Preview API Token.
GraphQL Endpoint: https://<Environment host name>/sitecore/api/graph/edge (where Environment host name can be retrieved from Deploy app --> Details --> Environment host name)
JSS_APP_NAME: name of the front-end app mentioned in package.json.
- Developer can setup/develop the front-end app using Mac or Windows.
- Developer can work on published and unpublished content as CM has both the content. - Using Experience Edge
In this case, Experience Edge can serve the content for the front-end app.
API Key: You can retrieve the Edge Delivery API Token from the XM Cloud deploy app. Go to your XM Cloud project in Deploy app --> Details --> Edge Delivery GraphQL IDE (Experience Edge) --> Generate Preview API Token.
GraphQL Endpoint: https://edge.sitecorecloud.io/api/graphql/v1
JSS_APP_NAME: name of the front-end app mentioned in package.json.
- Developer can setup/develop the front-end app using Mac or Windows.
- Developer can work only on published content as edge delivery has only published content.
No comments:
Post a Comment