Building and Running Server-Side Rendering

Building

To simply build the Intershop PWA in server-side rendering mode, you can use the package.json script npm run build, which builds the Intershop PWA with the production configuration of the angular.json.
Afterwards you can start the application with npm run serve (or do both by using npm run start).

The preferred way for production deployments is to build the Dockerfile in the project root and run the created image.
While building, you can provide a build argument (i.e. via --build-arg) configuration and build a different configuration from angular.json.
By default the production configuration is built.

All configuration options can also be multiple configurations like --configuration=brand,production, where production should always come last.

Running

Overwriting configurations of the PWA is entirely done by environment variables.
This approach was chosen to have the best possible compatibility when running the PWA either from the command line or in an orchestrator.

To set environment variables in windows run for example set SSR_HYBRID=true on the command line before executing the npm run commands.

If the format is any, then the environment variable has to be set to any value to be active.
Setting it to "false" still counts as active.
Only empty strings count as inactive.

If the format is switch, the property is switched on by supplying on, 1, yes or true (checked case-insensitive), anything else is considered off.

All parameters are case sensitive.
Make sure to use them as written in the table below.

Running with https

We deliver a selfsigned x509 certifciate for local development/deployment purposes only.
For obvious reasons (e.g we do not know your hostname) we cannot deliver a certificate that is accepted by web browsers.
Therefore be prepared for security questions when first accessing the site.

Our image build process is expecting files server.crt and server.key in folder dist.
Extension crt is the certifcate and key represents the private key.

Further References

• Concept - Configuration
• Concept - Hybrid Approach
• Concept - Logging
• Concept - Single Sign-On (SSO) for PWA
• Guide - Client-Side Error Monitoring with Sentry
• Guide - Google Tag Manager
• Guide - Monitoring with Prometheus
• Youtube - Server Side Rendering and Pre Rendering with Angular Universal
• Google Developers - Rendering on the Web