Skip to main content
Version: 4.8

AngularJS

Angular App Stack​

The Angular application stack is used to build and deploy Angular application and produce deployment-ready containers for the SCALE environment.

The containers produced with this stack share some common requirements with other application stacks deployed to the SCALE environment. These shared requirements include:

  • Security scanning for any vulnerabilities
  • Code coverage scanning for test quality
  • Staging of the application container in the appropriate Docker container repositories and tagged according to SCALE conventions
  • Completion of Unit Testing and User Acceptance Testing
  • Gated approvals before allowing deployments into pre-production and production environments
  • Audit trail and history of deployment within the SCALE CI/CD Pipeline

Because of the above-listed requirements, the Angular application stack is provided in order to support the build and deployment of Angular application in a manner that integrates with SCALE requirements and processes. The flow of deployment includes first a Continuous Integration stage of processing in a pipeline prior to deployment in the Continuous Deployment stages. The Continuous Integration stage focuses on building the application, running scans to check for test coverage and security vulnerabilities, and staging the container in the appropriate Docker repository ready for deployment. Subsequent pipeline stages deploy the application to the appropriate target Kubernetes spaces.

For details on getting started, see getting started.

For details on repository structure, see repository structure.

The source directory will contain Angular source code of the application. The config directory contains the nginx.conf file to be used in the build pipeline.

For details on application configuration, see application configuration.

For details on CI/CD pipelines, see CI/CD pipelines.

Upgrading to Pipeline v4.7​

Note: Please refer to v4.30, v4.4, v4.5 of the Angular documentation for details on Angular upgrade. Please note this version of pipeline is backward compactible with all versions of Angular and also supports both Cypress and Protractor for E2E Testing.

Note: - Node version is defaulted to 20. Angular is upgraded to v18 and all the dependencies are updated too.

For details on upgrading to Pipeline v4.7, see upgrading to Pipeline v4.7.

For details on pipeline definition, see pipeline definition.

Application-Specific Pipeline Configuration​

The extends YAML object is a complex object consisting of additional YAML objects. This object is used to extend the v4.7 pipeline logic (referenced by the repository defined in the resources object) by (a) referencing the correct appstack pipeline entry point (devops/angularjs.yml for the Angular pipeline) and (b) passing a set of YAML objects as parameters to influence the behavior of the pipeline to meet an application teams specific needs.

The extends YAML object consists of 2 objects beneath it:

  • template
  • parameters

The template YAML object is a single value set to the initial entry point for the v4.7 pipeline for the Angular appstack, so it should always be defined as follows:

extends:
  template: devops/angularjs.yml@spaces

The parameters YAML object is defined immediately following the template object and at the same indentation level. This is the object that requires the most attention and definition to be set up.

The parameters YAML object includes multiple parameters which can be used to configure CI/CD pipeline. Primarily this object contains parameters used for software builds. A typical setting in here would be to define appVersion used to build the application, looking like the following (including all of the extends object preceding it):

extends:
  template: devops/angularjs.yml@spaces
  parameters:
    appVersion: 4.7.x

Web Server image configuration​

Pipeline uses latest official nginx image as base image for building Angular docker image. Different image can be configured using baseImage parameter as follows:

extends:
  template: devops/angularjs.yml@spaces
  parameters:
    webserver:
      baseImage: "library/nginx:stable-alpine"

For details on skipping deployments, see skipping deployments.

For details on defining hostspaces, see defining hostspaces.

Update nginx configuration file​

As part of SCALE pipeline releases, we keep update base images that we provide for each application stack. Each newer version of base image may have latest configurations supported. Post upgrade, please refer Configuration Details to compare and update newer configurations into your repository.

For details on Horizontal Pod Autoscaler, see Horizontal Pod Autoscaler.

For details on Pod Anti-Affinity, see Pod Anti-Affinity.

For details on PVC for application stacks, see PVC for application stacks.

For details on detailed pipeline configuration, see detailed pipeline configuration.

For details on Kubernetes deployment objects, see Kubernetes deployment objects.

For details on troubleshooting, see troubleshooting.