Angular (4) - Shopping Basket Example

Build Status

See it in action https://jonsamwell.github.io/angular-simple-shopping-cart/

Architectural Summary

  • Angular 4 application (scaffolded with angular-cli)
  • Built around RxJS Observables
  • One way data flow and events based processing
  • Immutable shopping cart to increase performance by enabling the OnPush change detention strategy that drastically reduces the change subtree Angular needs to process.
  • Unit tested via Karma and Jasmine.
  • SinonJS used for test mocking.
  • Minimal styling with Foundation CSS used as the base framework and SCSS used to process custom styles.
  • Basic example of async e2e test using new (async/await) Typescript syntax.

Setup

Install the npm dependencies

npm install

Build

npm run build

Run Tests

npm run test

Run E2E Tests

npm run e2e

Serve

HTTP development server

npm run start

Then navigate to http://localhost:4200/

HTTPS development server (note: the development certificate will have to be added as a trusted CA)

npm run start:https

Then navigate to https://localhost:4200/