Managing Angular Components in SAP Commerce Cloud CMS

Frontend
1

I’m working on a SAP Commerce project where we use Angular for the frontend. We build Angular components and set up proxy configurations to handle API calls to the backend.

Here’s an example of our proxy setup:

{
  "/api/commerce/*": {
    "target": "http://localhost:9001",
    "secure": false,
    "changeOrigin": true,
    "logLevel": "debug"
  }
}

What I’m trying to figure out is how to properly manage and configure these Angular components from the SAP Commerce administration area. Specifically, how can we control these components through the backoffice or CMS tools? Is there a standard approach for this kind of integration?

Any guidance would be really helpful. Thanks!

2

You need a solid component registration strategy. I’ve found the best approach is creating a mapping service that links your Angular components to SAP Commerce CMS definitions. Set up a central registry with unique IDs that match your backend component types, then configure dynamic loading based on your CMS data structure. Everything runs smoothly once you’ve got proper attribute binding between CMS config and your Angular component inputs. Don’t forget to include CMS endpoints in your proxy config so you can fetch component data in real-time during development.

3

Nice setup! Are you trying to make your Angular components configurable through Hybris backoffice, or is this more about content management? I’ve watched teams struggle with bridging frontend and CMS - what component properties do you need to control from the admin side?

4

been there! create custom cms components in hybris that map to your angular components. define the component types in items.xml with configurable attributes, then manage content through the cms cockpit. your angular app fetches component data through the cms api endpoints. works smoothly once u get it set up right.