Name: Integrating SAP Commerce Cloud and Composable Storefront with SAP Customer Data Cloud - Part 2
Uploaded: 2024-5-10
Duration: 403 s
Description: In Part 2 of this three-part video series, we’ll introduce some codes and configurations to help you understand how to integrate SAP Commerce Cloud and Composable Storefront with SAP Customer Data Cloud.

Share feedback

<p>Planned maintenance of Practice Systems</p>

Planned maintenance of Practice Systems

Why create an SAP account?

Enhance your learning experience

SAP Learning

Subscribe now

Learn more

Live Sessions

Hands-on Practice

Certification

My Learning

Ready to start learning?

<div><div><div><div>In Part 2 of this three-part video series, we’ll introduce some codes and configurations to help you understand how to integrate SAP Commerce Cloud and Composable Storefront with SAP Customer Data Cloud.</div></div></div></div>

Integrating SAP Commerce Cloud and Composable Storefront with SAP Customer Data Cloud - Part 2

Welcome to this video of Integrating SAP Commerce Cloud and Composable Storefront Part 2 of 3.  In this video, we’ll introduce some codes  and configurations to help you understand  how to integrate SAP Commerce Cloud  and Composable Storefront  with SAP Customer Data Cloud.   To build the SAP Commerce Cloud and Composable Storefront solution,  we need a Git repository to push the solution codes and configurations.   In this demo, we’ll use the SAP Git repository  to commit the codes.   The SAP Commerce Cloud backend codes and configurations  are committed at the C4H620 repository.   The SAP Commerce Cloud Composable Storefront frontend codes  are committed at the js-storefront folder.   We’ll walk through some codes and configurations to understand how to integrate SAP Commerce Cloud  and Composable Storefront with SAP Customer Data Cloud.   In the SAP Git repository,  navigate to the core-customize folder  and open the manifest.json file.   This is the cloud build instructions file  for SAP Commerce Cloud.   In the manifest.json file,  we specify the SAP Commerce Cloud version to 2211.19 and the hybris-commerce-integrations extension pack version to 2211.19.   The useConfig section specifies specifies the local configuration files  to be included in the cloud build.   For example, we’ll look at the api.properties file  for the API aspect or service.   The extensions we’ll build are specified  in the localextensions.xml file.    We’ll also see the gigya extensions  in the file.  Navigate to the core-customize/hybris/config folder  and open the localextensions.xml file.   At the end of the file,  we see the gigya extensions.   These are the SAP Commerce Cloud codes and configurations to implement  the SAP Customer Data Cloud integration features.   For example, the gigyabackoffice extension  implements the Backoffice capability  to connect with SAP Customer Data Cloud,  map the fields, and configure the sessions.   Navigate to the core-customize/hybris/config /environments folder  and open the api.properties file.   We added the property entries  for the S3 storage bucket configuration,  including the access key and secret.   A better approach would be  putting the secret in a security file  and uploading it from the cloud portal  or adding the secret properties  directly on the cloud portal as service properties  Navigate to the core-customize/hybris/bin/custom/ folder.   The spartacussampledata extension  imports the sample data  to the Composable Storefront site.   Navigate to the js-storefront folder  and open the manifest.json file.   This is the Composable Storefront cloud build instructions,  where we specify the Angular application name,  CSR and SSR path, RBSC repository,  and node.js version number.   Navigate to the js-storefront/b2cstore  /src  /app  /spartacus  /features folder.   We added a CDC folder and module CDCFeatureModule.   Open the CDC-feature.module.ts file  in the CDC folder.   We imported the CDC integration feature module in the codes,  which will only be lazy loaded  when the features are accessed.   We also added the CDC config,  including the SAP Commerce Cloud base site id,  CDC site API key,  and Web SDK.   The CDC FeatureModule  needs to be included in the spartacus-features.module.ts file under js-storefront/b2cstore/src/app/spartacus/,  otherwise it won’t be loaded  into the SAP Commerce Cloud Composable Storefront application.   The backend and frontend application codes  are ready in the SAP Git repository.   We can now use the SAP Commerce Cloud Portal tools  to build the codes and deploy the build  to a cloud environment.  Log onto the Cloud Portal  and navigate to Repository under Resources.   Enter the repository URL, username,  and token, and choose Save.   Navigate to Builds under Deployment.   Choose Create,   enter a name and the Git branch as “main,”   and choose Save to create a new build.   The new build will be scheduled  and will start in a few minutes.  It usually takes around 30 minutes  to build the backend and frontend applications fully.  When the new build is completed  and successful,  choose the build on the Builds screen   and then choose Deploy to Environment.   On the Deploy Build screen,  choose the target environment p1,   Initialize database for Platform Update Mode,   and Recreate for Deployment Mode.   Choose Deploy to start the deployment.   It takes around 40 minutes  to deploy the build on the Kubernetes cluster.   Once the deployment is completed and successful, we’re taken to the environment page,  where we can see the Status, Public Endpoints,  and the Services of the environment.   Choose the Backoffice URL  and login with the admin credentials from the hcs_admin service properties.   This concludes our part 2 demo  of SAP Commerce Cloud and Composable Storefront Integration  with SAP Customer Data Cloud.   Thank you for watching.