SHOPin Logo
Skip to main documentation content

Building blocks

How the SHOPin storefront accelerator organises storefront UI, shared constants, contracts, and translations—and where to add code so boundaries stay clear.

In this section

  • Feature — features/ layout, import boundaries, links to BFF and contracts.
  • Component — components/ui, components/layout, Storybook, tokens, tests, imports.
  • Icons — public/icons/ SVGs, a11y, imports, Storybook parity.
  • Translations — @core/i18n, @config/constants locales, BFF i18n.service, next-intl.
  • Config & constants — @config/constants, index.ts exports, vs @core/contracts.
  • Maintain contracts — @core/contracts, Zod, domains, check-types.

Back to How to work with SHOPin