Stack Name - Angular7 MongoDB

Synopsis

The is the base reusable implementation for Angular type tech stacks.  The stack includes:
  • Angular7 using a Model-View-Controller design pattern
  • Fully functional front-end with a mix of
    • Material Design
    • HTML5
    • JQuery
    • Bootstrap
    • Javascript
    • Typescript

Details

Author dev@harbormaster.ai
Access Public
Derived From .nodejs.tech.stack .mongodb.tech.stack
Long Name Angular7 MongoDB
Short Name Angular7
Language(s) Javascript, Typescript, YAML, XML, Velocity Macros
Git Url https://github.com/Harbormaster-AI/techstacks/tree/main/Angular7
Example Project YAML https://github.com/Harbormaster-AI/cli/blob/main/samples/yamls/project.as.code/angular7-mongo-project-as-code.yml

Contents

Along with what is supported by the parent  tech stack (.nodejs.tech.stack), the following are overridden and additional capabilities:
  • Build:
    • A set of macros containing Angular 7 specifics which override CI/CD defaults found in the parent tech stack. These come in to play during the generation of a vendor specific CI/CD YAML file.
  • Angular Files:
    • The set of Angular files required to create a fully functional Angular compliant web application complete with a presentation tier, backend tier, and persistence tier.  These files are generally agnostic to subsequent Angular versions and therefore are valuable when this tech stack is derived from.

Usage

If using a CI/CD platform such as CircleCI, AWS Codebuild, Jenkins, etc.., it is best to refer to the Pipeline YAML file generated for that platform. If not using a CI/CD platform refer to the instructions below on how to use the generated project.

To get started manually

The following instructions assume NPM is installed. If not, you can download it by installing Node.js.

Install the Angular CLI

npm install -g @angular/cli
Create a new project by the name used to generate the application. Note: It is important to use this name because the next step expects this name. 
ng new <>

Copying Generated Files

From the current directory, pull the generated files from the Git repository committed to.

Development Server

Run ng serve for a dev server. Navigate to http://localhost:4200/. The app will automatically reload if you change any of the source files.

Build

Run ng build to build the project. The build artifacts will be stored in the dist/ directory. Use the –prod flag for a production build.

MongoDB Setup

It is assumed MongoDB is running at the specified host url that was provided as part of the application options. See file ./config/mongoDb.js to make changes to the database location

Running Unit Tests

Run ng test to execute the unit tests via Karma.

Running End-to-End Tests

Run ng e2e to execute the end-to-end tests via Protractor.