Introduction Angular CMS Components View Contexts Design View Design Preview Navigation CMS Components Integration with an External CMS Introduction The Intershop REST API contains resources reflecting the aspects of Intershop's integrated Content Management System (CMS), i.e. Pagelets, Includes, Pages

NGINX Optimizations NGINX Optimizations Custom Webpack Build PurgeCSS Safelisting Development Further References The NGINX building block applies: Compression of responses ngx_brotli is used to compress files on NGINX because Brotli has a better compression ratio compared to gzip. The configuration of

Server Side Rendering robots.txt Page Metadata Optimized URLs This concept documents our approach for search engine optimization for the Intershop Progressive Web App. Server Side Rendering The PWA uses Universal for pre-rendering complete pages to tackle SEO concerns. An Angular application without

Code Integrity Dependencies Code Formatting Unit Testing UI Testing Universal Testing Static Code Analysis This section provides an overview of required continuous integration steps to verify the validity of code contributions. All mentioned tools provide feedback on success or failure via exit code

JSDoc Tags Document Only When Needed! The JSDoc comment format is used for general information. Examples for the comment styling pattern can be found here: TypeDoc - DocComments. Use this format to describe components, modules, etc., but also methods, inputs, variables and so on. Example for General

Configuring ESLint Custom ESLint Rules The PWA uses ESLint for static code analysis and to enforce best practices. In order to use ESLint with Angular, we use the typescript-eslint and angular-eslint packages extensively. The PWA's ruleset is configured in .eslintrc.json and includes base rulesets to

Configuration Login Registration Token Lifetime Logout This document describes the authentication mechanism if punchout is used as identity provider. If you need an introduction to this topic, read the Authentication Concept first. Configuration The PWA must be configured in a specific way to use punchout

When to Write Cypress Tests? Rules for Developing Cypress Tests Always Stick to Small Scope Pay Respect to Individuality Do not Reinvent the Wheel Stick to the PageObject Pattern Debugging Flaky Cypress Tests Further References When to Write Cypress Tests? With Angular most of the functionality of simple

Bootstrap Integration Assets Fonts Icons Optimization References The visual design (styling) and the interaction design (behavior) of the Intershop Progressive Web App is derived from the Responsive Starter Store with some changes (e.g., the header) to improve and modernize the customer experience and

Developers Getting Started Architecture Concept - Software Architecture Concept - Project Structure Concept - State Management Guide - State Management Guide - Product Context Concept - CMS Integration Concept - Configuration Guide - Propagating Environment Variables Concept - Localization Concept -

Thank you for your interest in the Intershop PWA project. We look forward for any kind of contribution. Code of Conduct We have adopted the Contributor Covenants Code of Conduct and we expect project participants to adhere to it. Please read and follow our Code of Conduct. Non-Code Contributions You

Login Registration Token Lifetime Logout This document describes the main authentication mechanism if the ICM server is used as identity provider. If you need an introduction to this topic, read the Authentication Concept first. Login If the user wants to login by clicking a login link or navigating

SSO with Auth0 for PWA Business Cases Create New User User Forgot Password Further References Intershop Commerce Management supports logging in clients via SSO (see Concept - Single Sign-On (SSO)). The PWA uses the library angular-oauth2-oidc to support an easy configuration for providing access to

Mapping Incoming Rewritten ICM URLs to the PWA Mapping PWA URLs to Rewritten ICM URLs Further References If the ICM is set up with URL Rewriting, further modifications are required to run the deployment with the Hybrid Approach. The examples in this guide follow the default example for ICM URL rewriting

Web App Manifest Service Worker In order to be a Progressive Web Application, the Intershop PWA implements some advanced concepts matching those criteria. Web App Manifest The Web App Manifest enables the PWA to be installable on home screens of mobile devices. The application is easily accessible via

The data models for server-side and client-side have to be separated, because the data sent by the server may change over iterations or may not be in the right format, while the client side shop data handling should be stable for a long time. Therefore, each service communicating with the Intershop REST

Server-Side Rendering (SSR) NGINX Logging to an External Device PWA (SSR with PM2) NGINX Further References Server-Side Rendering (SSR) The express.js image serving the Angular Universal Server-Side Rendering can be provisioned to log extended information to the console by supplying the environment

To enable Store Locator, add storeLocator to the feature list in your environment file. This will enable a page where users can search for stores based on a country, city and/or postal code. Google Maps Integration Store Locator provides an optional Google Maps integration using the Google Maps JavaScript

To enable user tracking and setting it up with Google Tag Manager, the popular library Angulartics2 is used. Note The standard Intershop PWA Google Tag Manager integration is very basic and currently only supports the tracking of route changes. Please refer to the angulartics2 documentation for information

Introduction Recipe: Configure the Order Export for the BI Data Hub Recipe: Add BI Dashboard to ICM Recipe: Create Report Based on Intershop Template Recipe: Adjust Reports Recipe: Download Default Report Templates from Intershop Introduction The BI Data Hub allows you to gain insight into different