Set up Mock
The SHOPin storefront accelerator includes a Mock integration (integrations/mock-api) for fake catalog, cart, navigation, and related flows when you set the BFF data source to mock-set.
For shared setup (clone, root .env, npm ci, dev servers), see How to setup SHOPin. For env variable names and comments, see Environment variables and .env.example.
Warning: The mock service does not cover every BFF service. Filling the gaps is work we might add later; for now it is low priority. You can extend mock-api and BFF wiring yourself, but that is a substantial fork-level effort. In practice it is hard to run the demo without Commercetools today: keep valid Commercetools credentials in .env unless you change the default factory.
Use mock-set
Set the data source to the mock value (for example DATA_SOURCE=mock-set). Allowed values and defaults live in config/constants/src/data-source/index.ts.
The optional demo/ workspace includes DataSourceSelector (demo package overview) if you want a UI to switch sources on a page you add it to. The default storefront does not ship a data-source picker on the home page.
For production, use Remove demo functionality, fix the data source in environment configuration only, and use a real commerce setup (for example Commercetools) instead of mock-set for customer-facing sites.
Verify
Run npm run dev and check that mock-backed content is visible in the storefront.