├── .vscode └── settings.json ├── README.md ├── cloning ├── .editorconfig ├── .gitignore ├── .vscode │ ├── extensions.json │ ├── launch.json │ └── tasks.json ├── README.md ├── angular.json ├── karma.conf.js ├── package-lock.json ├── package.json ├── src │ ├── app │ │ ├── app.component.css │ │ ├── app.component.html │ │ ├── app.component.spec.ts │ │ ├── app.component.ts │ │ ├── app.module.ts │ │ ├── core │ │ │ ├── cloner.service.ts │ │ │ ├── core.module.ts │ │ │ └── customers.service.ts │ │ ├── customer │ │ │ ├── customer-details │ │ │ │ ├── customer-details.component.css │ │ │ │ ├── customer-details.component.html │ │ │ │ ├── customer-details.component.spec.ts │ │ │ │ └── customer-details.component.ts │ │ │ ├── customer-list │ │ │ │ ├── customer-list.component.css │ │ │ │ ├── customer-list.component.html │ │ │ │ ├── customer-list.component.spec.ts │ │ │ │ └── customer-list.component.ts │ │ │ ├── customer.component.css │ │ │ ├── customer.component.html │ │ │ ├── customer.component.spec.ts │ │ │ ├── customer.component.ts │ │ │ └── customer.module.ts │ │ └── shared │ │ │ └── interfaces.ts │ ├── assets │ │ └── .gitkeep │ ├── environments │ │ ├── environment.prod.ts │ │ └── environment.ts │ ├── favicon.ico │ ├── index.html │ ├── main.ts │ ├── polyfills.ts │ ├── styles.css │ └── test.ts ├── tsconfig.app.json ├── tsconfig.json └── tsconfig.spec.json ├── demos ├── .editorconfig ├── .gitignore ├── .vscode │ ├── extensions.json │ ├── launch.json │ └── tasks.json ├── README.md ├── angular.json ├── karma.conf.js ├── package-lock.json ├── package.json ├── pnpm-lock.yaml ├── src │ ├── app │ │ ├── animations │ │ │ ├── expand-collapse.animations.ts │ │ │ ├── fade.animations.ts │ │ │ └── index.ts │ │ ├── app.component.ts │ │ ├── app.module.ts │ │ ├── communication │ │ │ ├── communication.component.ts │ │ │ ├── customer-details.component.ts │ │ │ └── customers-list.component.ts │ │ ├── component-inheritance │ │ │ ├── base-component.component.ts │ │ │ ├── component-inheritance.component.ts │ │ │ ├── widget1.component.ts │ │ │ └── widget2.component.ts │ │ ├── core │ │ │ ├── core.module.ts │ │ │ ├── interceptors │ │ │ │ └── auth.interceptor.ts │ │ │ └── services │ │ │ │ ├── browser-logger.service.ts │ │ │ │ ├── cloner.service.ts │ │ │ │ ├── data.service.ts │ │ │ │ ├── event-bus.service.ts │ │ │ │ ├── httpClientRxJS.service.ts │ │ │ │ └── subject.service.ts │ │ ├── features-modules │ │ │ ├── customers │ │ │ │ ├── customers.component.ts │ │ │ │ ├── customers.module.ts │ │ │ │ └── routes.ts │ │ │ ├── features-modules-routing.module.ts │ │ │ ├── features-modules.component.ts │ │ │ ├── features-modules.module.ts │ │ │ └── orders │ │ │ │ ├── orders.component.ts │ │ │ │ ├── orders.module.ts │ │ │ │ └── routes.ts │ │ ├── httpClientRxJS │ │ │ ├── httpClientRxJS.component.html │ │ │ └── httpClientRxJS.component.ts │ │ ├── pipes-functions │ │ │ └── pipes-functions.component.ts │ │ ├── planning │ │ │ └── planning.component.ts │ │ ├── routes.ts │ │ ├── shared │ │ │ ├── addtax-memo.pipe.ts │ │ │ ├── addtax.pipe.ts │ │ │ ├── age.pipe.ts │ │ │ ├── enums.ts │ │ │ ├── fullname.pipe.ts │ │ │ ├── index.ts │ │ │ ├── input-date.component.ts │ │ │ ├── interfaces.ts │ │ │ └── shared.module.ts │ │ ├── signals │ │ │ └── signals.component.ts │ │ ├── structuring-components │ │ │ ├── customer-details.component.ts │ │ │ ├── customers-list.component.ts │ │ │ └── structuring-components.component.ts │ │ ├── subjects │ │ │ └── subjects.component.ts │ │ └── view-model │ │ │ ├── 1-simple │ │ │ ├── simple-container.component.ts │ │ │ ├── simple-customer-details.component.ts │ │ │ ├── simple-customer-list.component.ts │ │ │ ├── simple-shell.component.ts │ │ │ └── simple.module.ts │ │ │ ├── 2-isolation │ │ │ ├── iso-container.component.ts │ │ │ ├── iso-customer-details.component.ts │ │ │ ├── iso-shell.component.ts │ │ │ ├── iso.module.ts │ │ │ └── simple-customer-list.component.ts │ │ │ ├── 3-vm │ │ │ ├── customer-vm.ts │ │ │ ├── vm-container.component.ts │ │ │ ├── vm-customer-details.component.ts │ │ │ ├── vm-customer-list.component.ts │ │ │ ├── vm-shell.component.ts │ │ │ └── vm.module.ts │ │ │ ├── 4-customers-orders │ │ │ ├── co-container.component.ts │ │ │ ├── co-customer-details.component.ts │ │ │ ├── co-customer-list.component.ts │ │ │ ├── co-order-details.component.ts │ │ │ ├── co-shell.component.ts │ │ │ ├── co-view.service.ts │ │ │ ├── co.module.ts │ │ │ ├── customer-vm.ts │ │ │ └── order-vm.ts │ │ │ ├── model │ │ │ ├── customer.ts │ │ │ ├── entity-cache.ts │ │ │ ├── entity-operations.ts │ │ │ ├── index.ts │ │ │ ├── line-item.ts │ │ │ ├── model-guards.ts │ │ │ ├── order.ts │ │ │ └── product.ts │ │ │ ├── services │ │ │ ├── customer-orders-data.service.ts │ │ │ ├── data.ts │ │ │ ├── index.ts │ │ │ └── order-graph.ts │ │ │ ├── view-model-shell.component.ts │ │ │ ├── view-model.css │ │ │ └── view-model.module.ts │ ├── assets │ │ ├── .gitkeep │ │ ├── angular.png │ │ ├── fabio.jpg │ │ ├── features-modules.jpg │ │ ├── features-modules.png │ │ ├── klum.jpg │ │ ├── lucy-liu.png │ │ ├── missing-person.png │ │ ├── people.1.json │ │ ├── people.json │ │ ├── planets.1.json │ │ ├── planets.json │ │ ├── styles.css │ │ ├── tyson-beckford.png │ │ └── zoolander.jpeg │ ├── environments │ │ ├── environment.prod.ts │ │ └── environment.ts │ ├── favicon.ico │ ├── index.html │ ├── main.ts │ ├── polyfills.ts │ ├── styles.css │ └── test.ts ├── tsconfig.app.json ├── tsconfig.json └── tsconfig.spec.json ├── input-output-demo ├── .editorconfig ├── .gitignore ├── .vscode │ ├── extensions.json │ ├── launch.json │ └── tasks.json ├── README.md ├── angular.json ├── karma.conf.js ├── package-lock.json ├── package.json ├── src │ ├── app │ │ ├── app.component.css │ │ ├── app.component.html │ │ ├── app.component.spec.ts │ │ ├── app.component.ts │ │ ├── app.module.ts │ │ └── customer │ │ │ ├── customer-details │ │ │ ├── customer-details.component.css │ │ │ ├── customer-details.component.html │ │ │ ├── customer-details.component.spec.ts │ │ │ └── customer-details.component.ts │ │ │ ├── customer.component.css │ │ │ ├── customer.component.html │ │ │ ├── customer.component.spec.ts │ │ │ ├── customer.component.ts │ │ │ └── customer.module.ts │ ├── assets │ │ └── .gitkeep │ ├── environments │ │ ├── environment.prod.ts │ │ └── environment.ts │ ├── favicon.ico │ ├── index.html │ ├── main.ts │ ├── polyfills.ts │ ├── styles.css │ └── test.ts ├── tsconfig.app.json ├── tsconfig.json └── tsconfig.spec.json ├── labs ├── angular-playground │ ├── .editorconfig │ ├── .gitignore │ ├── .prettierrc │ ├── README.md │ ├── angular-playground.json │ ├── angular.json │ ├── e2e │ │ ├── protractor.conf.js │ │ ├── src │ │ │ ├── app.e2e-spec.ts │ │ │ └── app.po.ts │ │ └── tsconfig.e2e.json │ ├── package-lock.json │ ├── package.json │ ├── src │ │ ├── app │ │ │ ├── app-routing.module.ts │ │ │ ├── app.component.html │ │ │ ├── app.component.ts │ │ │ ├── app.module.ts │ │ │ ├── core │ │ │ │ └── data.service.ts │ │ │ └── customers │ │ │ │ ├── customers-list │ │ │ │ ├── customers-list.component.html │ │ │ │ ├── customers-list.component.sandbox.ts │ │ │ │ ├── customers-list.component.ts │ │ │ │ └── scenario.snippet.txt │ │ │ │ ├── customers.component.html │ │ │ │ ├── customers.component.ts │ │ │ │ └── orders-list │ │ │ │ ├── orders-list.component.html │ │ │ │ └── orders-list.component.ts │ │ ├── assets │ │ │ └── .gitkeep │ │ ├── browserslist │ │ ├── docs.html │ │ ├── environments │ │ │ ├── environment.prod.ts │ │ │ └── environment.ts │ │ ├── favicon.ico │ │ ├── index.html │ │ ├── karma.conf.js │ │ ├── main.playground.ts │ │ ├── main.ts │ │ ├── polyfills.ts │ │ ├── styles.css │ │ ├── test.ts │ │ ├── tsconfig.app.json │ │ ├── tsconfig.spec.json │ │ └── tslint.json │ ├── tsconfig.json │ └── tslint.json ├── backup.json ├── backup.md ├── creating-an-observable-service │ ├── .browserslistrc │ ├── .editorconfig │ ├── .gitignore │ ├── .prettierrc │ ├── README.md │ ├── angular.json │ ├── package-lock.json │ ├── package.json │ ├── src │ │ ├── app │ │ │ ├── app.component.css │ │ │ ├── app.component.html │ │ │ ├── app.component.spec.ts │ │ │ ├── app.component.ts │ │ │ ├── app.module.ts │ │ │ ├── core │ │ │ │ ├── shopping-cart.service.spec.ts │ │ │ │ └── shopping-cart.service.ts │ │ │ ├── header │ │ │ │ ├── header.component.css │ │ │ │ ├── header.component.html │ │ │ │ ├── header.component.spec.ts │ │ │ │ └── header.component.ts │ │ │ └── products │ │ │ │ ├── products.component.css │ │ │ │ ├── products.component.html │ │ │ │ ├── products.component.spec.ts │ │ │ │ └── products.component.ts │ │ ├── assets │ │ │ └── .gitkeep │ │ ├── environments │ │ │ ├── environment.prod.ts │ │ │ └── environment.ts │ │ ├── favicon.ico │ │ ├── index.html │ │ ├── karma.conf.js │ │ ├── main.ts │ │ ├── polyfills.ts │ │ ├── styles.css │ │ ├── test.ts │ │ ├── tsconfig.app.json │ │ ├── tsconfig.spec.json │ │ └── tslint.json │ ├── tsconfig.json │ └── tslint.json ├── functions-pipes │ ├── .browserslistrc │ ├── .editorconfig │ ├── .gitignore │ ├── .prettierrc │ ├── README.md │ ├── angular.json │ ├── e2e │ │ ├── protractor.conf.js │ │ ├── src │ │ │ ├── app.e2e-spec.ts │ │ │ └── app.po.ts │ │ └── tsconfig.e2e.json │ ├── package-lock.json │ ├── package.json │ ├── src │ │ ├── app │ │ │ ├── app.component.css │ │ │ ├── app.component.html │ │ │ ├── app.component.spec.ts │ │ │ ├── app.component.ts │ │ │ ├── app.module.ts │ │ │ ├── win-percentage.pipe.spec.ts │ │ │ └── win-percentage.pipe.ts │ │ ├── assets │ │ │ └── .gitkeep │ │ ├── environments │ │ │ ├── environment.prod.ts │ │ │ └── environment.ts │ │ ├── favicon.ico │ │ ├── index.html │ │ ├── karma.conf.js │ │ ├── main.ts │ │ ├── polyfills.ts │ │ ├── styles.css │ │ ├── test.ts │ │ ├── tsconfig.app.json │ │ ├── tsconfig.spec.json │ │ └── tslint.json │ ├── tsconfig.json │ └── tslint.json ├── http-interceptors │ ├── begin │ │ ├── .browserslistrc │ │ ├── .editorconfig │ │ ├── .gitignore │ │ ├── .prettierrc │ │ ├── README.md │ │ ├── angular.json │ │ ├── db.json │ │ ├── e2e │ │ │ ├── protractor.conf.js │ │ │ ├── src │ │ │ │ ├── app.e2e-spec.ts │ │ │ │ └── app.po.ts │ │ │ └── tsconfig.json │ │ ├── karma.conf.js │ │ ├── package-lock.json │ │ ├── package.json │ │ ├── proxy.conf.json │ │ ├── routes.json │ │ ├── src │ │ │ ├── app │ │ │ │ ├── app.component.ts │ │ │ │ ├── app.module.ts │ │ │ │ ├── core │ │ │ │ │ ├── header-bar-brand.component.ts │ │ │ │ │ ├── header-bar-links.component.ts │ │ │ │ │ ├── header-bar.component.ts │ │ │ │ │ ├── hero.ts │ │ │ │ │ └── index.ts │ │ │ │ ├── heroes │ │ │ │ │ ├── hero-list.component.ts │ │ │ │ │ ├── hero.service.ts │ │ │ │ │ ├── heroes.component.ts │ │ │ │ │ └── index.ts │ │ │ │ ├── interceptors │ │ │ │ │ ├── auth.interceptor.ts │ │ │ │ │ ├── auth.service.ts │ │ │ │ │ ├── csrf.interceptor.ts │ │ │ │ │ ├── index.ts │ │ │ │ │ ├── log-headers.interceptor.ts │ │ │ │ │ └── log-response.interceptor.ts │ │ │ │ ├── shared │ │ │ │ │ ├── button-footer.component.ts │ │ │ │ │ ├── card-content.component.ts │ │ │ │ │ ├── list-header.component.ts │ │ │ │ │ └── shared.module.ts │ │ │ │ └── store │ │ │ │ │ ├── config.ts │ │ │ │ │ ├── entity-metadata.ts │ │ │ │ │ └── store.module.ts │ │ │ ├── assets │ │ │ │ └── .gitkeep │ │ │ ├── environments │ │ │ │ ├── environment.prod.ts │ │ │ │ └── environment.ts │ │ │ ├── favicon.ico │ │ │ ├── index.html │ │ │ ├── main.ts │ │ │ ├── polyfills.ts │ │ │ ├── styles.scss │ │ │ └── test.ts │ │ ├── tsconfig.app.json │ │ ├── tsconfig.json │ │ ├── tsconfig.spec.json │ │ └── tslint.json │ └── end │ │ ├── .browserslistrc │ │ ├── .editorconfig │ │ ├── .gitignore │ │ ├── .prettierrc │ │ ├── README.md │ │ ├── angular.json │ │ ├── db.json │ │ ├── e2e │ │ ├── protractor.conf.js │ │ ├── src │ │ │ ├── app.e2e-spec.ts │ │ │ └── app.po.ts │ │ └── tsconfig.json │ │ ├── karma.conf.js │ │ ├── package-lock.json │ │ ├── package.json │ │ ├── proxy.conf.json │ │ ├── routes.json │ │ ├── src │ │ ├── app │ │ │ ├── app.component.ts │ │ │ ├── app.module.ts │ │ │ ├── core │ │ │ │ ├── header-bar-brand.component.ts │ │ │ │ ├── header-bar-links.component.ts │ │ │ │ ├── header-bar.component.ts │ │ │ │ ├── hero.ts │ │ │ │ └── index.ts │ │ │ ├── heroes │ │ │ │ ├── hero-list.component.ts │ │ │ │ ├── hero.service.ts │ │ │ │ ├── heroes.component.ts │ │ │ │ └── index.ts │ │ │ ├── interceptors │ │ │ │ ├── auth.interceptor.ts │ │ │ │ ├── auth.service.ts │ │ │ │ ├── csrf.interceptor.ts │ │ │ │ ├── index.ts │ │ │ │ ├── log-headers.interceptor.ts │ │ │ │ └── log-response.interceptor.ts │ │ │ ├── shared │ │ │ │ ├── button-footer.component.ts │ │ │ │ ├── card-content.component.ts │ │ │ │ ├── list-header.component.ts │ │ │ │ └── shared.module.ts │ │ │ └── store │ │ │ │ ├── config.ts │ │ │ │ ├── entity-metadata.ts │ │ │ │ └── store.module.ts │ │ ├── assets │ │ │ └── .gitkeep │ │ ├── environments │ │ │ ├── environment.prod.ts │ │ │ └── environment.ts │ │ ├── favicon.ico │ │ ├── index.html │ │ ├── main.ts │ │ ├── polyfills.ts │ │ ├── styles.scss │ │ └── test.ts │ │ ├── tsconfig.app.json │ │ ├── tsconfig.json │ │ ├── tsconfig.spec.json │ │ └── tslint.json ├── routing-guards-and-preload-strategies │ ├── begin │ │ ├── .browserslistrc │ │ ├── .editorconfig │ │ ├── .gitignore │ │ ├── .prettierrc │ │ ├── README.md │ │ ├── angular.json │ │ ├── package-lock.json │ │ ├── package.json │ │ ├── src │ │ │ ├── README.md │ │ │ ├── app │ │ │ │ ├── app-dev.module.ts │ │ │ │ ├── app.component.html │ │ │ │ ├── app.component.scss │ │ │ │ ├── app.component.ts │ │ │ │ ├── app.module.ts │ │ │ │ ├── core │ │ │ │ │ ├── core.module.ts │ │ │ │ │ ├── in-memory-data.service.ts │ │ │ │ │ ├── index.ts │ │ │ │ │ ├── model │ │ │ │ │ │ ├── hero.ts │ │ │ │ │ │ ├── index.ts │ │ │ │ │ │ └── villain.ts │ │ │ │ │ ├── module-import-check.ts │ │ │ │ │ ├── network-aware-preload-strategy.ts │ │ │ │ │ ├── opt-in-preload-strategy.ts │ │ │ │ │ ├── toast.service.ts │ │ │ │ │ └── toolbar │ │ │ │ │ │ ├── toolbar.component.html │ │ │ │ │ │ ├── toolbar.component.scss │ │ │ │ │ │ └── toolbar.component.ts │ │ │ │ ├── heroes │ │ │ │ │ ├── hero-detail │ │ │ │ │ │ ├── hero-detail.component.html │ │ │ │ │ │ ├── hero-detail.component.scss │ │ │ │ │ │ └── hero-detail.component.ts │ │ │ │ │ ├── hero-list │ │ │ │ │ │ ├── hero-list.component.html │ │ │ │ │ │ ├── hero-list.component.scss │ │ │ │ │ │ └── hero-list.component.ts │ │ │ │ │ ├── hero.service.ts │ │ │ │ │ ├── heroes.module.ts │ │ │ │ │ ├── heroes │ │ │ │ │ │ ├── heroes.component.html │ │ │ │ │ │ ├── heroes.component.scss │ │ │ │ │ │ └── heroes.component.ts │ │ │ │ │ └── routes.ts │ │ │ │ ├── routes.ts │ │ │ │ ├── shared │ │ │ │ │ └── shared.module.ts │ │ │ │ └── villains │ │ │ │ │ ├── routes.ts │ │ │ │ │ ├── villain-detail-container │ │ │ │ │ ├── villain-detail-container.component.html │ │ │ │ │ ├── villain-detail-container.component.scss │ │ │ │ │ └── villain-detail-container.component.ts │ │ │ │ │ ├── villain-detail │ │ │ │ │ ├── villain-detail.component.html │ │ │ │ │ ├── villain-detail.component.scss │ │ │ │ │ └── villain-detail.component.ts │ │ │ │ │ ├── villain-list │ │ │ │ │ ├── villain-list.component.html │ │ │ │ │ ├── villain-list.component.scss │ │ │ │ │ └── villain-list.component.ts │ │ │ │ │ ├── villain.service.ts │ │ │ │ │ ├── villains.module.ts │ │ │ │ │ └── villains │ │ │ │ │ ├── villains.component.html │ │ │ │ │ ├── villains.component.scss │ │ │ │ │ └── villains.component.ts │ │ │ ├── assets │ │ │ │ ├── .gitkeep │ │ │ │ ├── jp-48.jpg │ │ │ │ ├── jp.jpg │ │ │ │ ├── ng.png │ │ │ │ ├── wb-48.jpg │ │ │ │ └── wb.jpg │ │ │ ├── environments │ │ │ │ ├── environment.prod.ts │ │ │ │ └── environment.ts │ │ │ ├── favicon.ico │ │ │ ├── index.html │ │ │ ├── karma.conf.js │ │ │ ├── main.ts │ │ │ ├── polyfills.ts │ │ │ ├── styles.css │ │ │ ├── styles │ │ │ │ ├── mixin.scss │ │ │ │ ├── styles.scss │ │ │ │ └── theme.scss │ │ │ ├── test.ts │ │ │ ├── tsconfig.app.json │ │ │ ├── tsconfig.spec.json │ │ │ └── tslint.json │ │ ├── tsconfig.json │ │ └── tslint.json │ └── end │ │ ├── .browserslistrc │ │ ├── .editorconfig │ │ ├── .gitignore │ │ ├── .prettierrc │ │ ├── README.md │ │ ├── angular.json │ │ ├── package-lock.json │ │ ├── package.json │ │ ├── src │ │ ├── README.md │ │ ├── app │ │ │ ├── app-dev.module.ts │ │ │ ├── app.component.html │ │ │ ├── app.component.scss │ │ │ ├── app.component.ts │ │ │ ├── app.module.ts │ │ │ ├── core │ │ │ │ ├── auth.guard.ts │ │ │ │ ├── core.module.ts │ │ │ │ ├── in-memory-data.service.ts │ │ │ │ ├── index.ts │ │ │ │ ├── model │ │ │ │ │ ├── hero.ts │ │ │ │ │ ├── index.ts │ │ │ │ │ └── villain.ts │ │ │ │ ├── module-import-check.ts │ │ │ │ ├── network-aware-preload-strategy.ts │ │ │ │ ├── opt-in-preload-strategy.ts │ │ │ │ ├── toast.service.ts │ │ │ │ └── toolbar │ │ │ │ │ ├── toolbar.component.html │ │ │ │ │ ├── toolbar.component.scss │ │ │ │ │ └── toolbar.component.ts │ │ │ ├── heroes │ │ │ │ ├── hero-detail │ │ │ │ │ ├── hero-detail.component.html │ │ │ │ │ ├── hero-detail.component.scss │ │ │ │ │ └── hero-detail.component.ts │ │ │ │ ├── hero-list │ │ │ │ │ ├── hero-list.component.html │ │ │ │ │ ├── hero-list.component.scss │ │ │ │ │ └── hero-list.component.ts │ │ │ │ ├── hero.service.ts │ │ │ │ ├── heroes.module.ts │ │ │ │ ├── heroes │ │ │ │ │ ├── heroes.component.html │ │ │ │ │ ├── heroes.component.scss │ │ │ │ │ └── heroes.component.ts │ │ │ │ └── routes.ts │ │ │ ├── routes.ts │ │ │ ├── shared │ │ │ │ └── shared.module.ts │ │ │ └── villains │ │ │ │ ├── routes.ts │ │ │ │ ├── villain-detail-container │ │ │ │ ├── villain-detail-container.component.html │ │ │ │ ├── villain-detail-container.component.scss │ │ │ │ └── villain-detail-container.component.ts │ │ │ │ ├── villain-detail │ │ │ │ ├── villain-detail.component.html │ │ │ │ ├── villain-detail.component.scss │ │ │ │ └── villain-detail.component.ts │ │ │ │ ├── villain-list │ │ │ │ ├── villain-list.component.html │ │ │ │ ├── villain-list.component.scss │ │ │ │ └── villain-list.component.ts │ │ │ │ ├── villain.service.ts │ │ │ │ ├── villains.module.ts │ │ │ │ └── villains │ │ │ │ ├── villains.component.html │ │ │ │ ├── villains.component.scss │ │ │ │ └── villains.component.ts │ │ ├── assets │ │ │ ├── .gitkeep │ │ │ ├── jp-48.jpg │ │ │ ├── jp.jpg │ │ │ ├── ng.png │ │ │ ├── wb-48.jpg │ │ │ └── wb.jpg │ │ ├── environments │ │ │ ├── environment.prod.ts │ │ │ └── environment.ts │ │ ├── favicon.ico │ │ ├── index.html │ │ ├── karma.conf.js │ │ ├── main.ts │ │ ├── polyfills.ts │ │ ├── styles.css │ │ ├── styles │ │ │ ├── mixin.scss │ │ │ ├── styles.scss │ │ │ └── theme.scss │ │ ├── test.ts │ │ ├── tsconfig.app.json │ │ ├── tsconfig.spec.json │ │ └── tslint.json │ │ ├── tsconfig.json │ │ └── tslint.json ├── rxjs-subjects │ ├── begin │ │ ├── .browserslistrc │ │ ├── .editorconfig │ │ ├── .gitignore │ │ ├── .prettierrc │ │ ├── README.md │ │ ├── angular.json │ │ ├── e2e │ │ │ ├── protractor.conf.js │ │ │ ├── src │ │ │ │ ├── app.e2e-spec.ts │ │ │ │ └── app.po.ts │ │ │ └── tsconfig.e2e.json │ │ ├── package-lock.json │ │ ├── package.json │ │ ├── src │ │ │ ├── app │ │ │ │ ├── app.component.css │ │ │ │ ├── app.component.html │ │ │ │ ├── app.component.ts │ │ │ │ ├── app.module.ts │ │ │ │ └── core │ │ │ │ │ └── subjects.service.ts │ │ │ ├── assets │ │ │ │ └── .gitkeep │ │ │ ├── environments │ │ │ │ ├── environment.prod.ts │ │ │ │ └── environment.ts │ │ │ ├── favicon.ico │ │ │ ├── index.html │ │ │ ├── karma.conf.js │ │ │ ├── main.ts │ │ │ ├── polyfills.ts │ │ │ ├── styles.css │ │ │ ├── test.ts │ │ │ ├── tsconfig.app.json │ │ │ ├── tsconfig.spec.json │ │ │ └── tslint.json │ │ ├── tsconfig.json │ │ └── tslint.json │ └── end │ │ ├── .browserslistrc │ │ ├── .editorconfig │ │ ├── .gitignore │ │ ├── .prettierrc │ │ ├── README.md │ │ ├── angular.json │ │ ├── e2e │ │ ├── protractor.conf.js │ │ ├── src │ │ │ ├── app.e2e-spec.ts │ │ │ └── app.po.ts │ │ └── tsconfig.e2e.json │ │ ├── package-lock.json │ │ ├── package.json │ │ ├── src │ │ ├── app │ │ │ ├── app.component.css │ │ │ ├── app.component.html │ │ │ ├── app.component.ts │ │ │ ├── app.module.ts │ │ │ └── core │ │ │ │ └── subjects.service.ts │ │ ├── assets │ │ │ └── .gitkeep │ │ ├── environments │ │ │ ├── environment.prod.ts │ │ │ └── environment.ts │ │ ├── favicon.ico │ │ ├── index.html │ │ ├── karma.conf.js │ │ ├── main.ts │ │ ├── polyfills.ts │ │ ├── styles.css │ │ ├── test.ts │ │ ├── tsconfig.app.json │ │ ├── tsconfig.spec.json │ │ └── tslint.json │ │ ├── tsconfig.json │ │ └── tslint.json ├── shared-project │ ├── .editorconfig │ ├── .gitignore │ ├── README.md │ ├── angular.json │ ├── karma.conf.js │ ├── package-lock.json │ ├── package.json │ ├── projects │ │ └── shared-lib │ │ │ ├── .gitignore │ │ │ ├── README.md │ │ │ ├── karma.conf.js │ │ │ ├── ng-package.json │ │ │ ├── package-lock.json │ │ │ ├── package.json │ │ │ ├── src │ │ │ ├── lib │ │ │ │ ├── shared-lib.component.spec.ts │ │ │ │ ├── shared-lib.component.ts │ │ │ │ ├── shared-lib.module.ts │ │ │ │ ├── shared-lib.service.spec.ts │ │ │ │ └── shared-lib.service.ts │ │ │ ├── public-api.ts │ │ │ └── test.ts │ │ │ ├── tsconfig.lib.json │ │ │ ├── tsconfig.lib.prod.json │ │ │ ├── tsconfig.spec.json │ │ │ └── tslint.json │ ├── src │ │ ├── app │ │ │ ├── app.component.css │ │ │ ├── app.component.html │ │ │ ├── app.component.spec.ts │ │ │ ├── app.component.ts │ │ │ └── app.module.ts │ │ ├── assets │ │ │ └── .gitkeep │ │ ├── environments │ │ │ ├── environment.prod.ts │ │ │ └── environment.ts │ │ ├── favicon.ico │ │ ├── index.html │ │ ├── main.ts │ │ ├── polyfills.ts │ │ ├── styles.css │ │ └── test.ts │ ├── tsconfig.app.json │ ├── tsconfig.json │ ├── tsconfig.spec.json │ └── tslint.json ├── standalone │ ├── begin │ │ ├── .browserslistrc │ │ ├── .editorconfig │ │ ├── .gitignore │ │ ├── .prettierrc │ │ ├── README.md │ │ ├── angular.json │ │ ├── package-lock.json │ │ ├── package.json │ │ ├── src │ │ │ ├── README.md │ │ │ ├── app │ │ │ │ ├── app-dev.module.ts │ │ │ │ ├── app.component.scss │ │ │ │ ├── app.component.ts │ │ │ │ ├── app.config.ts │ │ │ │ ├── app.module.ts │ │ │ │ ├── core │ │ │ │ │ ├── auth.guard.ts │ │ │ │ │ ├── core.module.ts │ │ │ │ │ ├── in-memory-data.service.ts │ │ │ │ │ ├── index.ts │ │ │ │ │ ├── model │ │ │ │ │ │ ├── hero.ts │ │ │ │ │ │ ├── index.ts │ │ │ │ │ │ └── villain.ts │ │ │ │ │ ├── module-import-check copy.ts │ │ │ │ │ ├── module-import-check.ts │ │ │ │ │ ├── network-aware-preload-strategy.ts │ │ │ │ │ ├── opt-in-preload-strategy.ts │ │ │ │ │ ├── toast.service.ts │ │ │ │ │ └── toolbar │ │ │ │ │ │ ├── toolbar.component.html │ │ │ │ │ │ ├── toolbar.component.scss │ │ │ │ │ │ └── toolbar.component.ts │ │ │ │ ├── heroes │ │ │ │ │ ├── hero-detail │ │ │ │ │ │ ├── hero-detail.component.html │ │ │ │ │ │ ├── hero-detail.component.scss │ │ │ │ │ │ └── hero-detail.component.ts │ │ │ │ │ ├── hero-list │ │ │ │ │ │ ├── hero-list.component.html │ │ │ │ │ │ ├── hero-list.component.scss │ │ │ │ │ │ └── hero-list.component.ts │ │ │ │ │ ├── hero.service.ts │ │ │ │ │ ├── heroes.module.ts │ │ │ │ │ ├── heroes │ │ │ │ │ │ ├── heroes.component.html │ │ │ │ │ │ ├── heroes.component.scss │ │ │ │ │ │ └── heroes.component.ts │ │ │ │ │ └── routes.ts │ │ │ │ ├── routes.ts │ │ │ │ ├── shared │ │ │ │ │ └── shared.module.ts │ │ │ │ ├── standalone-imports.ts │ │ │ │ └── villains │ │ │ │ │ ├── villain-detail │ │ │ │ │ ├── villain-detail.component.html │ │ │ │ │ ├── villain-detail.component.scss │ │ │ │ │ └── villain-detail.component.ts │ │ │ │ │ ├── villain-list │ │ │ │ │ ├── villain-list.component.html │ │ │ │ │ ├── villain-list.component.scss │ │ │ │ │ └── villain-list.component.ts │ │ │ │ │ ├── villain.service.ts │ │ │ │ │ └── villains │ │ │ │ │ ├── villains.component.html │ │ │ │ │ ├── villains.component.scss │ │ │ │ │ └── villains.component.ts │ │ │ ├── assets │ │ │ │ ├── .gitkeep │ │ │ │ ├── jp-48.jpg │ │ │ │ ├── jp.jpg │ │ │ │ ├── ng.png │ │ │ │ ├── wb-48.jpg │ │ │ │ └── wb.jpg │ │ │ ├── environments │ │ │ │ ├── environment.prod.ts │ │ │ │ └── environment.ts │ │ │ ├── favicon.ico │ │ │ ├── index.html │ │ │ ├── karma.conf.js │ │ │ ├── main.ts │ │ │ ├── polyfills.ts │ │ │ ├── styles.css │ │ │ ├── styles │ │ │ │ ├── mixin.scss │ │ │ │ ├── styles.scss │ │ │ │ └── theme.scss │ │ │ ├── test.ts │ │ │ ├── tsconfig.app.json │ │ │ ├── tsconfig.spec.json │ │ │ └── tslint.json │ │ ├── tsconfig.json │ │ └── tslint.json │ ├── end │ │ ├── .browserslistrc │ │ ├── .editorconfig │ │ ├── .gitignore │ │ ├── .prettierrc │ │ ├── README.md │ │ ├── angular.json │ │ ├── package-lock.json │ │ ├── package.json │ │ ├── src │ │ │ ├── README.md │ │ │ ├── app │ │ │ │ ├── app.component.scss │ │ │ │ ├── app.component.ts │ │ │ │ ├── app.config.ts │ │ │ │ ├── core │ │ │ │ │ ├── auth.guard.ts │ │ │ │ │ ├── in-memory-data.service.ts │ │ │ │ │ ├── index.ts │ │ │ │ │ ├── model │ │ │ │ │ │ ├── hero.ts │ │ │ │ │ │ ├── index.ts │ │ │ │ │ │ └── villain.ts │ │ │ │ │ ├── network-aware-preload-strategy.ts │ │ │ │ │ ├── opt-in-preload-strategy.ts │ │ │ │ │ ├── toast.service.ts │ │ │ │ │ └── toolbar │ │ │ │ │ │ ├── toolbar.component.html │ │ │ │ │ │ ├── toolbar.component.scss │ │ │ │ │ │ └── toolbar.component.ts │ │ │ │ ├── heroes │ │ │ │ │ ├── hero-detail │ │ │ │ │ │ ├── hero-detail.component.html │ │ │ │ │ │ ├── hero-detail.component.scss │ │ │ │ │ │ └── hero-detail.component.ts │ │ │ │ │ ├── hero-list │ │ │ │ │ │ ├── hero-list.component.html │ │ │ │ │ │ ├── hero-list.component.scss │ │ │ │ │ │ └── hero-list.component.ts │ │ │ │ │ ├── hero.service.ts │ │ │ │ │ └── heroes │ │ │ │ │ │ ├── heroes.component.html │ │ │ │ │ │ ├── heroes.component.scss │ │ │ │ │ │ └── heroes.component.ts │ │ │ │ ├── routes.ts │ │ │ │ ├── standalone-imports.ts │ │ │ │ └── villains │ │ │ │ │ ├── villain-detail │ │ │ │ │ ├── villain-detail.component.html │ │ │ │ │ ├── villain-detail.component.scss │ │ │ │ │ └── villain-detail.component.ts │ │ │ │ │ ├── villain-list │ │ │ │ │ ├── villain-list.component.html │ │ │ │ │ ├── villain-list.component.scss │ │ │ │ │ └── villain-list.component.ts │ │ │ │ │ ├── villain.service.ts │ │ │ │ │ └── villains │ │ │ │ │ ├── villains.component.html │ │ │ │ │ ├── villains.component.scss │ │ │ │ │ └── villains.component.ts │ │ │ ├── assets │ │ │ │ ├── .gitkeep │ │ │ │ ├── jp-48.jpg │ │ │ │ ├── jp.jpg │ │ │ │ ├── ng.png │ │ │ │ ├── wb-48.jpg │ │ │ │ └── wb.jpg │ │ │ ├── environments │ │ │ │ ├── environment.prod.ts │ │ │ │ └── environment.ts │ │ │ ├── favicon.ico │ │ │ ├── index.html │ │ │ ├── karma.conf.js │ │ │ ├── main.ts │ │ │ ├── polyfills.ts │ │ │ ├── styles.css │ │ │ ├── styles │ │ │ │ ├── mixin.scss │ │ │ │ ├── styles.scss │ │ │ │ └── theme.scss │ │ │ ├── test.ts │ │ │ ├── tsconfig.app.json │ │ │ ├── tsconfig.spec.json │ │ │ └── tslint.json │ │ ├── tsconfig.json │ │ └── tslint.json │ └── reference │ │ ├── .browserslistrc │ │ ├── .editorconfig │ │ ├── .gitignore │ │ ├── .prettierrc │ │ ├── README.md │ │ ├── angular.json │ │ ├── package-lock.json │ │ ├── package.json │ │ ├── src │ │ ├── app │ │ │ ├── app-dev.module.ts │ │ │ ├── app.component.scss │ │ │ ├── app.component.ts │ │ │ ├── app.module.ts │ │ │ ├── core │ │ │ │ ├── auth.guard.ts │ │ │ │ ├── core.module.ts │ │ │ │ ├── in-memory-data.service.ts │ │ │ │ ├── index.ts │ │ │ │ ├── model │ │ │ │ │ ├── hero.ts │ │ │ │ │ ├── index.ts │ │ │ │ │ └── villain.ts │ │ │ │ ├── module-import-check.ts │ │ │ │ ├── network-aware-preload-strategy.ts │ │ │ │ ├── opt-in-preload-strategy.ts │ │ │ │ ├── toast.service.ts │ │ │ │ └── toolbar │ │ │ │ │ ├── toolbar.component.html │ │ │ │ │ ├── toolbar.component.scss │ │ │ │ │ └── toolbar.component.ts │ │ │ ├── heroes │ │ │ │ ├── hero-detail │ │ │ │ │ ├── hero-detail.component.html │ │ │ │ │ ├── hero-detail.component.scss │ │ │ │ │ └── hero-detail.component.ts │ │ │ │ ├── hero-list │ │ │ │ │ ├── hero-list.component.html │ │ │ │ │ ├── hero-list.component.scss │ │ │ │ │ └── hero-list.component.ts │ │ │ │ ├── hero.service.ts │ │ │ │ ├── heroes.module.ts │ │ │ │ ├── heroes │ │ │ │ │ ├── heroes.component.html │ │ │ │ │ ├── heroes.component.scss │ │ │ │ │ └── heroes.component.ts │ │ │ │ └── routes.ts │ │ │ ├── routes.ts │ │ │ ├── shared │ │ │ │ └── shared.module.ts │ │ │ └── villains │ │ │ │ ├── routes.ts │ │ │ │ ├── villain-detail │ │ │ │ ├── villain-detail.component.html │ │ │ │ ├── villain-detail.component.scss │ │ │ │ └── villain-detail.component.ts │ │ │ │ ├── villain-list │ │ │ │ ├── villain-list.component.html │ │ │ │ ├── villain-list.component.scss │ │ │ │ └── villain-list.component.ts │ │ │ │ ├── villain.service.ts │ │ │ │ ├── villains.module.ts │ │ │ │ └── villains │ │ │ │ ├── villains.component.html │ │ │ │ ├── villains.component.scss │ │ │ │ └── villains.component.ts │ │ ├── assets │ │ │ ├── .gitkeep │ │ │ ├── jp-48.jpg │ │ │ ├── jp.jpg │ │ │ ├── ng.png │ │ │ ├── wb-48.jpg │ │ │ └── wb.jpg │ │ ├── environments │ │ │ ├── environment.prod.ts │ │ │ └── environment.ts │ │ ├── favicon.ico │ │ ├── index.html │ │ ├── karma.conf.js │ │ ├── main.ts │ │ ├── polyfills.ts │ │ ├── styles.css │ │ ├── styles │ │ │ ├── mixin.scss │ │ │ ├── styles.scss │ │ │ └── theme.scss │ │ ├── test.ts │ │ ├── tsconfig.app.json │ │ ├── tsconfig.spec.json │ │ └── tslint.json │ │ ├── tsconfig.json │ │ └── tslint.json ├── state-management │ ├── ngrx-data │ │ ├── begin │ │ │ ├── .editorconfig │ │ │ ├── .gitignore │ │ │ ├── .prettierrc │ │ │ ├── README.md │ │ │ ├── angular.json │ │ │ ├── e2e │ │ │ │ ├── app.e2e-spec.ts │ │ │ │ ├── app.po.ts │ │ │ │ └── tsconfig.e2e.json │ │ │ ├── karma.conf.js │ │ │ ├── package-lock.json │ │ │ ├── package.json │ │ │ ├── src │ │ │ │ ├── app │ │ │ │ │ ├── app-dev.module.ts │ │ │ │ │ ├── app.component.html │ │ │ │ │ ├── app.component.scss │ │ │ │ │ ├── app.component.ts │ │ │ │ │ ├── app.module.ts │ │ │ │ │ ├── core │ │ │ │ │ │ ├── core.module.ts │ │ │ │ │ │ ├── in-memory-data.service.ts │ │ │ │ │ │ ├── model │ │ │ │ │ │ │ ├── customer.ts │ │ │ │ │ │ │ └── order.ts │ │ │ │ │ │ └── sorter.service.ts │ │ │ │ │ ├── customers │ │ │ │ │ │ ├── customers-edit │ │ │ │ │ │ │ ├── customers-edit.component.html │ │ │ │ │ │ │ ├── customers-edit.component.scss │ │ │ │ │ │ │ └── customers-edit.component.ts │ │ │ │ │ │ ├── customers-list │ │ │ │ │ │ │ ├── customers-list.component.html │ │ │ │ │ │ │ ├── customers-list.component.ts │ │ │ │ │ │ │ └── filter-textbox.component.ts │ │ │ │ │ │ ├── customers.component.html │ │ │ │ │ │ ├── customers.component.ts │ │ │ │ │ │ ├── customers.module.ts │ │ │ │ │ │ ├── customers.service.ts │ │ │ │ │ │ └── routes.ts │ │ │ │ │ ├── orders │ │ │ │ │ │ ├── orders.component.html │ │ │ │ │ │ ├── orders.component.scss │ │ │ │ │ │ ├── orders.component.ts │ │ │ │ │ │ ├── orders.module.ts │ │ │ │ │ │ ├── orders.service.ts │ │ │ │ │ │ └── routes.ts │ │ │ │ │ ├── routes.ts │ │ │ │ │ ├── shared │ │ │ │ │ │ ├── capitalize.pipe.ts │ │ │ │ │ │ └── shared.module.ts │ │ │ │ │ └── store │ │ │ │ │ │ ├── app-store.module.ts │ │ │ │ │ │ └── entity-metadata.ts │ │ │ │ ├── assets │ │ │ │ │ └── styles.css │ │ │ │ ├── environments │ │ │ │ │ ├── environment.prod.ts │ │ │ │ │ └── environment.ts │ │ │ │ ├── favicon.ico │ │ │ │ ├── index.html │ │ │ │ ├── main.ts │ │ │ │ ├── polyfills.ts │ │ │ │ ├── test.ts │ │ │ │ ├── tsconfig.app.json │ │ │ │ ├── tsconfig.spec.json │ │ │ │ └── typings.d.ts │ │ │ ├── tsconfig.json │ │ │ └── tslint.json │ │ └── end │ │ │ ├── .prettierrc │ │ │ └── readme.md │ ├── ngrx │ │ ├── begin │ │ │ ├── .browserslistrc │ │ │ ├── .editorconfig │ │ │ ├── .gitignore │ │ │ ├── .prettierrc │ │ │ ├── README.md │ │ │ ├── angular.json │ │ │ ├── e2e │ │ │ │ ├── app.e2e-spec.ts │ │ │ │ ├── app.po.ts │ │ │ │ └── tsconfig.e2e.json │ │ │ ├── karma.conf.js │ │ │ ├── package-lock.json │ │ │ ├── package.json │ │ │ ├── src │ │ │ │ ├── app │ │ │ │ │ ├── app-dev.module.ts │ │ │ │ │ ├── app.component.html │ │ │ │ │ ├── app.component.scss │ │ │ │ │ ├── app.component.ts │ │ │ │ │ ├── app.module.ts │ │ │ │ │ ├── core │ │ │ │ │ │ ├── core.module.ts │ │ │ │ │ │ ├── in-memory-data.service.ts │ │ │ │ │ │ ├── model │ │ │ │ │ │ │ ├── customer.ts │ │ │ │ │ │ │ └── order.ts │ │ │ │ │ │ └── sorter.service.ts │ │ │ │ │ ├── customers │ │ │ │ │ │ ├── customers-edit │ │ │ │ │ │ │ ├── customers-edit.component.html │ │ │ │ │ │ │ ├── customers-edit.component.scss │ │ │ │ │ │ │ └── customers-edit.component.ts │ │ │ │ │ │ ├── customers-list │ │ │ │ │ │ │ ├── customers-list.component.html │ │ │ │ │ │ │ ├── customers-list.component.ts │ │ │ │ │ │ │ └── filter-textbox.component.ts │ │ │ │ │ │ ├── customers.component.html │ │ │ │ │ │ ├── customers.component.ts │ │ │ │ │ │ ├── customers.module.ts │ │ │ │ │ │ └── routes.ts │ │ │ │ │ ├── orders │ │ │ │ │ │ ├── orders.component.html │ │ │ │ │ │ ├── orders.component.scss │ │ │ │ │ │ ├── orders.component.ts │ │ │ │ │ │ ├── orders.module.ts │ │ │ │ │ │ └── routes.ts │ │ │ │ │ ├── routes.ts │ │ │ │ │ ├── shared │ │ │ │ │ │ ├── capitalize.pipe.ts │ │ │ │ │ │ └── shared.module.ts │ │ │ │ │ └── store │ │ │ │ │ │ ├── actions │ │ │ │ │ │ ├── customer.actions.ts │ │ │ │ │ │ ├── data.actions.ts │ │ │ │ │ │ ├── index.ts │ │ │ │ │ │ └── order.actions.ts │ │ │ │ │ │ ├── app-store.module.ts │ │ │ │ │ │ ├── effects │ │ │ │ │ │ ├── customer.effects.ts │ │ │ │ │ │ └── order.effects.ts │ │ │ │ │ │ ├── index.ts │ │ │ │ │ │ ├── reducers │ │ │ │ │ │ ├── customer.reducer.ts │ │ │ │ │ │ ├── index.ts │ │ │ │ │ │ └── order.reducer.ts │ │ │ │ │ │ └── services │ │ │ │ │ │ ├── customer-data.service.ts │ │ │ │ │ │ ├── customer.selectors.ts │ │ │ │ │ │ ├── data-error.service.ts │ │ │ │ │ │ ├── index.ts │ │ │ │ │ │ ├── order-data.service.ts │ │ │ │ │ │ └── order.selectors.ts │ │ │ │ ├── assets │ │ │ │ │ └── styles.css │ │ │ │ ├── environments │ │ │ │ │ ├── environment.prod.ts │ │ │ │ │ └── environment.ts │ │ │ │ ├── favicon.ico │ │ │ │ ├── index.html │ │ │ │ ├── main.ts │ │ │ │ ├── polyfills.ts │ │ │ │ ├── test.ts │ │ │ │ ├── tsconfig.app.json │ │ │ │ ├── tsconfig.spec.json │ │ │ │ └── typings.d.ts │ │ │ ├── tsconfig.json │ │ │ └── tslint.json │ │ └── end │ │ │ ├── .prettierrc │ │ │ └── readme.md │ └── observable-store │ │ ├── begin │ │ ├── .browserslistrc │ │ ├── .editorconfig │ │ ├── .gitignore │ │ ├── .prettierrc │ │ ├── README.md │ │ ├── angular.json │ │ ├── karma.conf.js │ │ ├── package-lock.json │ │ ├── package.json │ │ ├── src │ │ │ ├── app │ │ │ │ ├── app-dev.module.ts │ │ │ │ ├── app.component.html │ │ │ │ ├── app.component.scss │ │ │ │ ├── app.component.ts │ │ │ │ ├── app.module.ts │ │ │ │ ├── core │ │ │ │ │ ├── core.module.ts │ │ │ │ │ ├── in-memory-data.service.ts │ │ │ │ │ ├── model │ │ │ │ │ │ ├── customer.ts │ │ │ │ │ │ ├── index.ts │ │ │ │ │ │ └── order.ts │ │ │ │ │ └── sorter.service.ts │ │ │ │ ├── customers │ │ │ │ │ ├── customers-edit │ │ │ │ │ │ ├── customers-edit.component.html │ │ │ │ │ │ ├── customers-edit.component.scss │ │ │ │ │ │ └── customers-edit.component.ts │ │ │ │ │ ├── customers-list │ │ │ │ │ │ ├── customers-list.component.html │ │ │ │ │ │ ├── customers-list.component.ts │ │ │ │ │ │ └── filter-textbox.component.ts │ │ │ │ │ ├── customers.component.html │ │ │ │ │ ├── customers.component.ts │ │ │ │ │ ├── customers.module.ts │ │ │ │ │ ├── customers.service.ts │ │ │ │ │ └── routes.ts │ │ │ │ ├── orders │ │ │ │ │ ├── orders.component.html │ │ │ │ │ ├── orders.component.scss │ │ │ │ │ ├── orders.component.ts │ │ │ │ │ ├── orders.module.ts │ │ │ │ │ ├── orders.service.ts │ │ │ │ │ └── routes.ts │ │ │ │ ├── routes.ts │ │ │ │ └── shared │ │ │ │ │ ├── capitalize.pipe.ts │ │ │ │ │ ├── interfaces.ts │ │ │ │ │ └── shared.module.ts │ │ │ ├── assets │ │ │ │ └── styles.css │ │ │ ├── environments │ │ │ │ ├── environment.prod.ts │ │ │ │ └── environment.ts │ │ │ ├── favicon.ico │ │ │ ├── index.html │ │ │ ├── main.ts │ │ │ ├── polyfills.ts │ │ │ ├── test.ts │ │ │ ├── tsconfig.app.json │ │ │ ├── tsconfig.spec.json │ │ │ └── typings.d.ts │ │ ├── tsconfig.json │ │ └── tslint.json │ │ └── end │ │ ├── .prettierrc │ │ └── readme.md └── view-models │ ├── begin │ ├── .browserslistrc │ ├── .editorconfig │ ├── .gitignore │ ├── .prettierrc │ ├── README.md │ ├── angular.json │ ├── karma.conf.js │ ├── package-lock.json │ ├── package.json │ ├── src │ │ ├── app │ │ │ ├── animations │ │ │ │ ├── expand-collapse.animations.ts │ │ │ │ ├── fade.animations.ts │ │ │ │ └── index.ts │ │ │ ├── app.component.css │ │ │ ├── app.component.ts │ │ │ ├── app.config.ts │ │ │ ├── customers │ │ │ │ ├── customer-container.component.ts │ │ │ │ ├── customer-details.component.ts │ │ │ │ ├── customer-list.component.ts │ │ │ │ ├── customer-vm.ts │ │ │ │ └── view-model.css │ │ │ ├── model │ │ │ │ ├── customer.ts │ │ │ │ ├── entity-cache.ts │ │ │ │ ├── entity-operations.ts │ │ │ │ ├── index.ts │ │ │ │ ├── line-item.ts │ │ │ │ ├── model-guards.ts │ │ │ │ ├── order.ts │ │ │ │ └── product.ts │ │ │ ├── services │ │ │ │ ├── customer-orders-data.service.ts │ │ │ │ ├── data.ts │ │ │ │ ├── index.ts │ │ │ │ └── order-graph.ts │ │ │ └── shared │ │ │ │ ├── age.pipe.ts │ │ │ │ ├── fullname.pipe.ts │ │ │ │ ├── index.ts │ │ │ │ └── input-date.component.ts │ │ ├── assets │ │ │ ├── .gitkeep │ │ │ ├── fabio.jpg │ │ │ ├── klum.jpg │ │ │ ├── lucy-liu.png │ │ │ ├── missing-person.png │ │ │ ├── tyson-beckford.png │ │ │ └── zoolander.jpeg │ │ ├── environments │ │ │ ├── environment.prod.ts │ │ │ └── environment.ts │ │ ├── favicon.ico │ │ ├── index.html │ │ ├── main.ts │ │ ├── polyfills.ts │ │ ├── styles.css │ │ └── test.ts │ ├── tsconfig.app.json │ ├── tsconfig.json │ ├── tsconfig.spec.json │ └── tslint.json │ ├── end │ ├── .browserslistrc │ ├── .editorconfig │ ├── .gitignore │ ├── .prettierrc │ ├── README.md │ ├── angular.json │ ├── karma.conf.js │ ├── package-lock.json │ ├── package.json │ ├── src │ │ ├── app │ │ │ ├── animations │ │ │ │ ├── expand-collapse.animations.ts │ │ │ │ ├── fade.animations.ts │ │ │ │ └── index.ts │ │ │ ├── app.component.css │ │ │ ├── app.component.ts │ │ │ ├── app.config.ts │ │ │ ├── customers │ │ │ │ ├── customer-container.component.ts │ │ │ │ ├── customer-details.component.ts │ │ │ │ ├── customer-list.component.ts │ │ │ │ ├── customer-vm.ts │ │ │ │ └── view-model.css │ │ │ ├── model │ │ │ │ ├── customer.ts │ │ │ │ ├── entity-cache.ts │ │ │ │ ├── entity-operations.ts │ │ │ │ ├── index.ts │ │ │ │ ├── line-item.ts │ │ │ │ ├── model-guards.ts │ │ │ │ ├── order.ts │ │ │ │ └── product.ts │ │ │ ├── services │ │ │ │ ├── customer-orders-data.service.ts │ │ │ │ ├── data.ts │ │ │ │ ├── index.ts │ │ │ │ └── order-graph.ts │ │ │ └── shared │ │ │ │ ├── age.pipe.ts │ │ │ │ ├── fullname.pipe.ts │ │ │ │ ├── index.ts │ │ │ │ └── input-date.component.ts │ │ ├── assets │ │ │ ├── .gitkeep │ │ │ ├── fabio.jpg │ │ │ ├── klum.jpg │ │ │ ├── lucy-liu.png │ │ │ ├── missing-person.png │ │ │ ├── tyson-beckford.png │ │ │ └── zoolander.jpeg │ │ ├── environments │ │ │ ├── environment.prod.ts │ │ │ └── environment.ts │ │ ├── favicon.ico │ │ ├── index.html │ │ ├── main.ts │ │ ├── polyfills.ts │ │ ├── styles.css │ │ └── test.ts │ ├── tsconfig.app.json │ ├── tsconfig.json │ ├── tsconfig.spec.json │ └── tslint.json │ └── package-lock.json ├── shared-library-abc-logging ├── .editorconfig ├── .gitignore ├── .vscode │ ├── extensions.json │ ├── launch.json │ └── tasks.json ├── README.md ├── angular.json ├── karma.conf.js ├── package-lock.json ├── package.json ├── projects │ └── browser-logger │ │ ├── README.md │ │ ├── karma.conf.js │ │ ├── ng-package.json │ │ ├── package-lock.json │ │ ├── package.json │ │ ├── src │ │ ├── lib │ │ │ ├── browser-logger.module.ts │ │ │ └── browser-logger.service.ts │ │ ├── public-api.ts │ │ └── test.ts │ │ ├── tsconfig.lib.json │ │ ├── tsconfig.lib.prod.json │ │ └── tsconfig.spec.json ├── src │ ├── app │ │ ├── app.component.ts │ │ └── app.module.ts │ ├── assets │ │ └── .gitkeep │ ├── environments │ │ ├── environment.prod.ts │ │ └── environment.ts │ ├── favicon.ico │ ├── index.html │ ├── main.ts │ ├── polyfills.ts │ ├── styles.css │ └── test.ts ├── tsconfig.app.json ├── tsconfig.json └── tsconfig.spec.json └── state-management ├── diy-store ├── .browserslistrc ├── .editorconfig ├── .gitignore ├── .prettierrc ├── README.md ├── angular.json ├── karma.conf.js ├── package-lock.json ├── package.json ├── src │ ├── app │ │ ├── animations │ │ │ ├── expand-collapse.animations.ts │ │ │ ├── fade.animations.ts │ │ │ └── index.ts │ │ ├── app.component.ts │ │ ├── app.config.ts │ │ ├── customers │ │ │ ├── customer-container.component.ts │ │ │ ├── customer-details.component.ts │ │ │ ├── customer-list.component.ts │ │ │ └── customer.css │ │ ├── in-memory-data-service │ │ │ ├── in-memory-data.service.ts │ │ │ └── mock-data.ts │ │ ├── model │ │ │ ├── customer.ts │ │ │ ├── index.ts │ │ │ └── order.ts │ │ ├── services │ │ │ ├── customer-orders-data.service.ts │ │ │ └── index.ts │ │ ├── shared │ │ │ ├── age.pipe.ts │ │ │ ├── fullname.pipe.ts │ │ │ ├── index.ts │ │ │ └── input-date.component.ts │ │ └── store │ │ │ ├── index.ts │ │ │ ├── store-guards.ts │ │ │ ├── store-metadata.ts │ │ │ └── store-operations.ts │ ├── assets │ │ ├── .gitkeep │ │ ├── fabio.jpg │ │ ├── klum.jpg │ │ ├── lucy-liu.png │ │ ├── missing-person.png │ │ ├── tyson-beckford.png │ │ └── zoolander.jpeg │ ├── environments │ │ ├── environment.prod.ts │ │ └── environment.ts │ ├── favicon.ico │ ├── index.html │ ├── main.ts │ ├── polyfills.ts │ ├── styles.css │ └── test.ts ├── tsconfig.app.json ├── tsconfig.json ├── tsconfig.spec.json └── tslint.json ├── ngrx-data ├── .editorconfig ├── .gitignore ├── .prettierrc ├── README.md ├── angular.json ├── e2e │ ├── app.e2e-spec.ts │ ├── app.po.ts │ └── tsconfig.e2e.json ├── karma.conf.js ├── package-lock.json ├── package.json ├── protractor.conf.js ├── src │ ├── app │ │ ├── app-dev.module.ts │ │ ├── app.component.html │ │ ├── app.component.scss │ │ ├── app.component.ts │ │ ├── app.module.ts │ │ ├── core │ │ │ ├── core.module.ts │ │ │ ├── in-memory-data.service.ts │ │ │ ├── model │ │ │ │ ├── customer.ts │ │ │ │ └── order.ts │ │ │ └── sorter.service.ts │ │ ├── customers │ │ │ ├── customers-edit │ │ │ │ ├── customers-edit.component.html │ │ │ │ ├── customers-edit.component.scss │ │ │ │ └── customers-edit.component.ts │ │ │ ├── customers-list │ │ │ │ ├── customers-list.component.html │ │ │ │ ├── customers-list.component.ts │ │ │ │ └── filter-textbox.component.ts │ │ │ ├── customers.component.html │ │ │ ├── customers.component.ts │ │ │ ├── customers.module.ts │ │ │ ├── customers.service.ts │ │ │ └── routes.ts │ │ ├── orders │ │ │ ├── orders.component.html │ │ │ ├── orders.component.scss │ │ │ ├── orders.component.ts │ │ │ ├── orders.module.ts │ │ │ ├── orders.service.ts │ │ │ └── routes.ts │ │ ├── routes.ts │ │ ├── shared │ │ │ ├── capitalize.pipe.ts │ │ │ └── shared.module.ts │ │ └── store │ │ │ ├── app-store.module.ts │ │ │ └── entity-metadata.ts │ ├── assets │ │ └── styles.css │ ├── environments │ │ ├── environment.prod.ts │ │ └── environment.ts │ ├── favicon.ico │ ├── index.html │ ├── main.ts │ ├── polyfills.ts │ ├── test.ts │ ├── tsconfig.app.json │ ├── tsconfig.spec.json │ └── typings.d.ts ├── tsconfig.json └── tslint.json ├── ngrx ├── .editorconfig ├── .gitignore ├── .prettierrc ├── README.md ├── angular.json ├── e2e │ ├── app.e2e-spec.ts │ ├── app.po.ts │ └── tsconfig.e2e.json ├── karma.conf.js ├── package-lock.json ├── package.json ├── protractor.conf.js ├── src │ ├── app │ │ ├── app-dev.module.ts │ │ ├── app.component.html │ │ ├── app.component.scss │ │ ├── app.component.ts │ │ ├── app.module.ts │ │ ├── core │ │ │ ├── core.module.ts │ │ │ ├── in-memory-data.service.ts │ │ │ ├── model │ │ │ │ ├── customer.ts │ │ │ │ └── order.ts │ │ │ └── sorter.service.ts │ │ ├── customers │ │ │ ├── customers-edit │ │ │ │ ├── customers-edit.component.html │ │ │ │ ├── customers-edit.component.scss │ │ │ │ └── customers-edit.component.ts │ │ │ ├── customers-list │ │ │ │ ├── customers-list.component.html │ │ │ │ ├── customers-list.component.ts │ │ │ │ └── filter-textbox.component.ts │ │ │ ├── customers.component.html │ │ │ ├── customers.component.ts │ │ │ └── customers.module.ts │ │ ├── orders │ │ │ ├── orders.component.html │ │ │ ├── orders.component.scss │ │ │ ├── orders.component.ts │ │ │ └── orders.module.ts │ │ ├── routes.ts │ │ ├── shared │ │ │ ├── capitalize.pipe.ts │ │ │ └── shared.module.ts │ │ └── store │ │ │ ├── actions │ │ │ ├── customer.actions.ts │ │ │ ├── data.actions.ts │ │ │ ├── index.ts │ │ │ └── order.actions.ts │ │ │ ├── app-store.module.ts │ │ │ ├── effects │ │ │ ├── customer.effects.ts │ │ │ └── order.effects.ts │ │ │ ├── index.ts │ │ │ ├── reducers │ │ │ ├── customer.reducer.ts │ │ │ ├── index.ts │ │ │ └── order.reducer.ts │ │ │ └── services │ │ │ ├── customer-data.service.ts │ │ │ ├── customer.selectors.ts │ │ │ ├── data-error.service.ts │ │ │ ├── index.ts │ │ │ ├── order-data.service.ts │ │ │ └── order.selectors.ts │ ├── assets │ │ └── styles.css │ ├── environments │ │ ├── environment.prod.ts │ │ └── environment.ts │ ├── favicon.ico │ ├── index.html │ ├── main.ts │ ├── polyfills.ts │ ├── test.ts │ ├── tsconfig.app.json │ ├── tsconfig.spec.json │ └── typings.d.ts ├── tsconfig.json └── tslint.json └── observable-store ├── .editorconfig ├── .gitignore ├── .vscode ├── extensions.json ├── launch.json └── tasks.json ├── README.md ├── angular.json ├── karma.conf.js ├── package-lock.json ├── package.json ├── src ├── app │ ├── app-dev.module.ts │ ├── app.component.html │ ├── app.component.scss │ ├── app.component.ts │ ├── app.module.ts │ ├── core │ │ ├── core.module.ts │ │ ├── in-memory-data.service.ts │ │ ├── model │ │ │ ├── customer.ts │ │ │ ├── index.ts │ │ │ └── order.ts │ │ └── sorter.service.ts │ ├── customers │ │ ├── customers-edit │ │ │ ├── customers-edit.component.html │ │ │ ├── customers-edit.component.scss │ │ │ └── customers-edit.component.ts │ │ ├── customers-list │ │ │ ├── customers-list.component.html │ │ │ ├── customers-list.component.ts │ │ │ └── filter-textbox.component.ts │ │ ├── customers.component.html │ │ ├── customers.component.ts │ │ ├── customers.module.ts │ │ ├── customers.service.ts │ │ └── routes.ts │ ├── orders │ │ ├── orders.component.html │ │ ├── orders.component.scss │ │ ├── orders.component.ts │ │ ├── orders.module.ts │ │ ├── orders.service.ts │ │ └── routes.ts │ ├── routes.ts │ └── shared │ │ ├── capitalize.pipe.ts │ │ ├── interfaces.ts │ │ └── shared.module.ts ├── assets │ ├── .gitkeep │ └── styles.css ├── environments │ ├── environment.prod.ts │ └── environment.ts ├── favicon.ico ├── index.html ├── main.ts ├── polyfills.ts ├── styles.css └── test.ts ├── tsconfig.app.json ├── tsconfig.json └── tsconfig.spec.json /cloning/.editorconfig: -------------------------------------------------------------------------------- 1 | # Editor configuration, see https://editorconfig.org 2 | root = true 3 | 4 | [*] 5 | charset = utf-8 6 | indent_style = space 7 | indent_size = 2 8 | insert_final_newline = true 9 | trim_trailing_whitespace = true 10 | 11 | [*.ts] 12 | quote_type = single 13 | 14 | [*.md] 15 | max_line_length = off 16 | trim_trailing_whitespace = false 17 | -------------------------------------------------------------------------------- /cloning/.vscode/extensions.json: -------------------------------------------------------------------------------- 1 | { 2 | // For more information, visit: https://go.microsoft.com/fwlink/?linkid=827846 3 | "recommendations": ["angular.ng-template"] 4 | } 5 | -------------------------------------------------------------------------------- /cloning/src/app/app.component.css: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/DanWahlin/angular-architecture/3075810e55f78dab9bc263849265af3763364ea7/cloning/src/app/app.component.css -------------------------------------------------------------------------------- /cloning/src/app/app.component.html: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /cloning/src/app/app.component.ts: -------------------------------------------------------------------------------- 1 | import { Component } from '@angular/core'; 2 | 3 | @Component({ 4 | selector: 'app-root', 5 | templateUrl: './app.component.html', 6 | styleUrls: ['./app.component.css'] 7 | }) 8 | export class AppComponent { 9 | title = 'input-output-demo'; 10 | } 11 | -------------------------------------------------------------------------------- /cloning/src/app/core/cloner.service.ts: -------------------------------------------------------------------------------- 1 | import { Injectable } from '@angular/core'; 2 | import * as clone from 'clone'; 3 | 4 | @Injectable({providedIn: 'root'}) 5 | export class ClonerService { 6 | deepClone(value: T): T { 7 | return clone(value) as T; 8 | } 9 | } 10 | -------------------------------------------------------------------------------- /cloning/src/app/core/core.module.ts: -------------------------------------------------------------------------------- 1 | import { NgModule } from '@angular/core'; 2 | import { CommonModule } from '@angular/common'; 3 | 4 | @NgModule({ 5 | declarations: [], 6 | imports: [ 7 | CommonModule 8 | ] 9 | }) 10 | export class CoreModule { } 11 | -------------------------------------------------------------------------------- /cloning/src/app/customer/customer-details/customer-details.component.css: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/DanWahlin/angular-architecture/3075810e55f78dab9bc263849265af3763364ea7/cloning/src/app/customer/customer-details/customer-details.component.css -------------------------------------------------------------------------------- /cloning/src/app/customer/customer-list/customer-list.component.css: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/DanWahlin/angular-architecture/3075810e55f78dab9bc263849265af3763364ea7/cloning/src/app/customer/customer-list/customer-list.component.css -------------------------------------------------------------------------------- /cloning/src/app/customer/customer-list/customer-list.component.html: -------------------------------------------------------------------------------- 1 |

Customers

2 | @if(customers) { 3 | 8 | } 9 | 10 |

11 | 12 | 17 | -------------------------------------------------------------------------------- /cloning/src/app/customer/customer.component.css: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/DanWahlin/angular-architecture/3075810e55f78dab9bc263849265af3763364ea7/cloning/src/app/customer/customer.component.css -------------------------------------------------------------------------------- /cloning/src/app/customer/customer.component.html: -------------------------------------------------------------------------------- 1 |

Customers

2 | @if(customer) { 3 |

{{ customer.name }}

4 | } 5 | 6 |
7 | 11 |

12 | 13 | -------------------------------------------------------------------------------- /cloning/src/app/shared/interfaces.ts: -------------------------------------------------------------------------------- 1 | export interface Customer { 2 | id: number; 3 | name: string; 4 | address: Address; 5 | orderTotal: number; 6 | orderTotalWithTax?: number; 7 | } 8 | 9 | export interface Address { 10 | city: string; 11 | } -------------------------------------------------------------------------------- /cloning/src/assets/.gitkeep: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/DanWahlin/angular-architecture/3075810e55f78dab9bc263849265af3763364ea7/cloning/src/assets/.gitkeep -------------------------------------------------------------------------------- /cloning/src/environments/environment.prod.ts: -------------------------------------------------------------------------------- 1 | export const environment = { 2 | production: true 3 | }; 4 | -------------------------------------------------------------------------------- /cloning/src/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/DanWahlin/angular-architecture/3075810e55f78dab9bc263849265af3763364ea7/cloning/src/favicon.ico -------------------------------------------------------------------------------- /cloning/src/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | MyProject 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | -------------------------------------------------------------------------------- /cloning/src/main.ts: -------------------------------------------------------------------------------- 1 | import { enableProdMode } from '@angular/core'; 2 | import { platformBrowserDynamic } from '@angular/platform-browser-dynamic'; 3 | 4 | import { AppModule } from './app/app.module'; 5 | import { environment } from './environments/environment'; 6 | 7 | if (environment.production) { 8 | enableProdMode(); 9 | } 10 | 11 | platformBrowserDynamic().bootstrapModule(AppModule) 12 | .catch(err => console.error(err)); 13 | -------------------------------------------------------------------------------- /cloning/src/styles.css: -------------------------------------------------------------------------------- 1 | /* You can add global styles to this file, and also import other style files */ 2 | -------------------------------------------------------------------------------- /cloning/tsconfig.app.json: -------------------------------------------------------------------------------- 1 | /* To learn more about this file see: https://angular.io/config/tsconfig. */ 2 | { 3 | "extends": "./tsconfig.json", 4 | "compilerOptions": { 5 | "outDir": "./out-tsc/app", 6 | "types": [] 7 | }, 8 | "files": [ 9 | "src/main.ts", 10 | "src/polyfills.ts" 11 | ], 12 | "include": [ 13 | "src/**/*.d.ts" 14 | ] 15 | } 16 | -------------------------------------------------------------------------------- /cloning/tsconfig.spec.json: -------------------------------------------------------------------------------- 1 | /* To learn more about this file see: https://angular.io/config/tsconfig. */ 2 | { 3 | "extends": "./tsconfig.json", 4 | "compilerOptions": { 5 | "outDir": "./out-tsc/spec", 6 | "types": [ 7 | "jasmine" 8 | ] 9 | }, 10 | "files": [ 11 | "src/test.ts", 12 | "src/polyfills.ts" 13 | ], 14 | "include": [ 15 | "src/**/*.spec.ts", 16 | "src/**/*.d.ts" 17 | ] 18 | } 19 | -------------------------------------------------------------------------------- /demos/.editorconfig: -------------------------------------------------------------------------------- 1 | # Editor configuration, see https://editorconfig.org 2 | root = true 3 | 4 | [*] 5 | charset = utf-8 6 | indent_style = space 7 | indent_size = 2 8 | insert_final_newline = true 9 | trim_trailing_whitespace = true 10 | 11 | [*.ts] 12 | quote_type = single 13 | 14 | [*.md] 15 | max_line_length = off 16 | trim_trailing_whitespace = false 17 | -------------------------------------------------------------------------------- /demos/.vscode/extensions.json: -------------------------------------------------------------------------------- 1 | { 2 | // For more information, visit: https://go.microsoft.com/fwlink/?linkid=827846 3 | "recommendations": ["angular.ng-template"] 4 | } 5 | -------------------------------------------------------------------------------- /demos/src/app/animations/index.ts: -------------------------------------------------------------------------------- 1 | export * from './expand-collapse.animations'; 2 | export * from './fade.animations'; 3 | -------------------------------------------------------------------------------- /demos/src/app/core/services/cloner.service.ts: -------------------------------------------------------------------------------- 1 | import { Injectable } from '@angular/core'; 2 | import * as clone from 'clone'; 3 | 4 | @Injectable({ 5 | providedIn: 'root', 6 | }) 7 | export class ClonerService { 8 | deepClone(value: T) { 9 | return clone(value); 10 | } 11 | } 12 | -------------------------------------------------------------------------------- /demos/src/app/features-modules/customers/customers.component.ts: -------------------------------------------------------------------------------- 1 | import { Component } from '@angular/core'; 2 | 3 | @Component({ 4 | selector: 'app-customers', 5 | template: ` 6 |

Lazy Loaded Customers Feature

7 |
8 | Feature has a routing module imported into its own module. 9 | `, 10 | }) 11 | export class CustomersComponent {} 12 | -------------------------------------------------------------------------------- /demos/src/app/features-modules/customers/customers.module.ts: -------------------------------------------------------------------------------- 1 | import { NgModule } from '@angular/core'; 2 | import { CommonModule } from '@angular/common'; 3 | 4 | import { components, routes } from './routes'; 5 | import { RouterModule } from '@angular/router'; 6 | 7 | @NgModule({ 8 | imports: [CommonModule, RouterModule.forChild(routes)], 9 | declarations: [components], 10 | }) 11 | export class CustomersModule {} 12 | -------------------------------------------------------------------------------- /demos/src/app/features-modules/customers/routes.ts: -------------------------------------------------------------------------------- 1 | import { Routes } from '@angular/router'; 2 | 3 | import { CustomersComponent } from './customers.component'; 4 | 5 | export const routes: Routes = [{ path: '', component: CustomersComponent }]; 6 | 7 | export const components = [CustomersComponent]; 8 | -------------------------------------------------------------------------------- /demos/src/app/features-modules/orders/orders.component.ts: -------------------------------------------------------------------------------- 1 | import { Component } from '@angular/core'; 2 | 3 | @Component({ 4 | selector: 'app-orders', 5 | template: ` 6 |

Lazy Loaded Orders Feature

7 |
8 | Feature has a routing module imported into its own module. 9 | `, 10 | }) 11 | export class OrdersComponent {} 12 | -------------------------------------------------------------------------------- /demos/src/app/features-modules/orders/orders.module.ts: -------------------------------------------------------------------------------- 1 | import { NgModule } from '@angular/core'; 2 | import { CommonModule } from '@angular/common'; 3 | 4 | import { components, routes } from './routes'; 5 | import { RouterModule } from '@angular/router'; 6 | 7 | @NgModule({ 8 | imports: [CommonModule, RouterModule.forChild(routes)], 9 | declarations: [components], 10 | }) 11 | export class OrdersModule {} 12 | -------------------------------------------------------------------------------- /demos/src/app/features-modules/orders/routes.ts: -------------------------------------------------------------------------------- 1 | import { Routes } from '@angular/router'; 2 | 3 | import { OrdersComponent } from './orders.component'; 4 | 5 | export const routes: Routes = [{ path: '', component: OrdersComponent }]; 6 | 7 | export const components = [OrdersComponent]; 8 | -------------------------------------------------------------------------------- /demos/src/app/shared/enums.ts: -------------------------------------------------------------------------------- 1 | export enum Theme { 2 | Light, 3 | Dark, 4 | } 5 | 6 | export enum SidebarPosition { 7 | Left, 8 | Right, 9 | } 10 | -------------------------------------------------------------------------------- /demos/src/app/shared/index.ts: -------------------------------------------------------------------------------- 1 | export { calcAge } from './age.pipe'; 2 | export { calcFullName } from './fullname.pipe'; 3 | -------------------------------------------------------------------------------- /demos/src/app/view-model/model/index.ts: -------------------------------------------------------------------------------- 1 | export * from './customer'; 2 | export * from './line-item'; 3 | export * from './order'; 4 | export * from './product'; 5 | 6 | export * from './entity-cache'; 7 | export * from './entity-operations'; 8 | -------------------------------------------------------------------------------- /demos/src/app/view-model/model/product.ts: -------------------------------------------------------------------------------- 1 | export class Product { 2 | id = 0; 3 | productName = ''; 4 | price = 0; 5 | 6 | static create(id: number, product: Partial = {}) { 7 | const newProduct = Object.assign(new Product(), { 8 | // Defaults 9 | productName: 'New Product ' + id, 10 | price: 0, 11 | ...product, 12 | id, 13 | }); 14 | return newProduct; 15 | } 16 | } 17 | -------------------------------------------------------------------------------- /demos/src/app/view-model/services/index.ts: -------------------------------------------------------------------------------- 1 | export * from './customer-orders-data.service'; 2 | export * from './order-graph'; 3 | -------------------------------------------------------------------------------- /demos/src/assets/.gitkeep: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/DanWahlin/angular-architecture/3075810e55f78dab9bc263849265af3763364ea7/demos/src/assets/.gitkeep -------------------------------------------------------------------------------- /demos/src/assets/angular.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/DanWahlin/angular-architecture/3075810e55f78dab9bc263849265af3763364ea7/demos/src/assets/angular.png -------------------------------------------------------------------------------- /demos/src/assets/fabio.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/DanWahlin/angular-architecture/3075810e55f78dab9bc263849265af3763364ea7/demos/src/assets/fabio.jpg -------------------------------------------------------------------------------- /demos/src/assets/features-modules.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/DanWahlin/angular-architecture/3075810e55f78dab9bc263849265af3763364ea7/demos/src/assets/features-modules.jpg -------------------------------------------------------------------------------- /demos/src/assets/features-modules.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/DanWahlin/angular-architecture/3075810e55f78dab9bc263849265af3763364ea7/demos/src/assets/features-modules.png -------------------------------------------------------------------------------- /demos/src/assets/klum.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/DanWahlin/angular-architecture/3075810e55f78dab9bc263849265af3763364ea7/demos/src/assets/klum.jpg -------------------------------------------------------------------------------- /demos/src/assets/lucy-liu.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/DanWahlin/angular-architecture/3075810e55f78dab9bc263849265af3763364ea7/demos/src/assets/lucy-liu.png -------------------------------------------------------------------------------- /demos/src/assets/missing-person.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/DanWahlin/angular-architecture/3075810e55f78dab9bc263849265af3763364ea7/demos/src/assets/missing-person.png -------------------------------------------------------------------------------- /demos/src/assets/styles.css: -------------------------------------------------------------------------------- 1 | main { 2 | margin-left: 25px; 3 | width: 92%; 4 | } 5 | 6 | form { 7 | width:50%; 8 | } 9 | 10 | .logo { 11 | height: 50px; 12 | margin-left: 20px; 13 | margin-right: 20px; 14 | } 15 | 16 | /* input.ng-invalid, select.ng-invalid { 17 | border-left: 5px solid #a94442; 18 | } 19 | 20 | input.ng-valid, select.ng-valid { 21 | border-left: 5px solid #42A948; 22 | } */ -------------------------------------------------------------------------------- /demos/src/assets/tyson-beckford.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/DanWahlin/angular-architecture/3075810e55f78dab9bc263849265af3763364ea7/demos/src/assets/tyson-beckford.png -------------------------------------------------------------------------------- /demos/src/assets/zoolander.jpeg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/DanWahlin/angular-architecture/3075810e55f78dab9bc263849265af3763364ea7/demos/src/assets/zoolander.jpeg -------------------------------------------------------------------------------- /demos/src/environments/environment.prod.ts: -------------------------------------------------------------------------------- 1 | export const environment = { 2 | production: true 3 | }; 4 | -------------------------------------------------------------------------------- /demos/src/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/DanWahlin/angular-architecture/3075810e55f78dab9bc263849265af3763364ea7/demos/src/favicon.ico -------------------------------------------------------------------------------- /demos/src/main.ts: -------------------------------------------------------------------------------- 1 | import { enableProdMode } from '@angular/core'; 2 | import { platformBrowserDynamic } from '@angular/platform-browser-dynamic'; 3 | 4 | import { AppModule } from './app/app.module'; 5 | import { environment } from './environments/environment'; 6 | 7 | if (environment.production) { 8 | enableProdMode(); 9 | } 10 | 11 | platformBrowserDynamic().bootstrapModule(AppModule) 12 | .catch(err => console.error(err)); 13 | -------------------------------------------------------------------------------- /demos/src/styles.css: -------------------------------------------------------------------------------- 1 | /* You can add global styles to this file, and also import other style files */ 2 | -------------------------------------------------------------------------------- /demos/tsconfig.app.json: -------------------------------------------------------------------------------- 1 | /* To learn more about this file see: https://angular.io/config/tsconfig. */ 2 | { 3 | "extends": "./tsconfig.json", 4 | "compilerOptions": { 5 | "outDir": "./out-tsc/app", 6 | "types": [] 7 | }, 8 | "files": [ 9 | "src/main.ts", 10 | "src/polyfills.ts" 11 | ], 12 | "include": [ 13 | "src/**/*.d.ts" 14 | ] 15 | } 16 | -------------------------------------------------------------------------------- /demos/tsconfig.spec.json: -------------------------------------------------------------------------------- 1 | /* To learn more about this file see: https://angular.io/config/tsconfig. */ 2 | { 3 | "extends": "./tsconfig.json", 4 | "compilerOptions": { 5 | "outDir": "./out-tsc/spec", 6 | "types": [ 7 | "jasmine" 8 | ] 9 | }, 10 | "files": [ 11 | "src/test.ts", 12 | "src/polyfills.ts" 13 | ], 14 | "include": [ 15 | "src/**/*.spec.ts", 16 | "src/**/*.d.ts" 17 | ] 18 | } 19 | -------------------------------------------------------------------------------- /input-output-demo/.editorconfig: -------------------------------------------------------------------------------- 1 | # Editor configuration, see https://editorconfig.org 2 | root = true 3 | 4 | [*] 5 | charset = utf-8 6 | indent_style = space 7 | indent_size = 2 8 | insert_final_newline = true 9 | trim_trailing_whitespace = true 10 | 11 | [*.ts] 12 | quote_type = single 13 | 14 | [*.md] 15 | max_line_length = off 16 | trim_trailing_whitespace = false 17 | -------------------------------------------------------------------------------- /input-output-demo/.vscode/extensions.json: -------------------------------------------------------------------------------- 1 | { 2 | // For more information, visit: https://go.microsoft.com/fwlink/?linkid=827846 3 | "recommendations": ["angular.ng-template"] 4 | } 5 | -------------------------------------------------------------------------------- /input-output-demo/src/app/app.component.css: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/DanWahlin/angular-architecture/3075810e55f78dab9bc263849265af3763364ea7/input-output-demo/src/app/app.component.css -------------------------------------------------------------------------------- /input-output-demo/src/app/app.component.html: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /input-output-demo/src/app/app.component.ts: -------------------------------------------------------------------------------- 1 | import { Component } from '@angular/core'; 2 | 3 | @Component({ 4 | selector: 'app-root', 5 | templateUrl: './app.component.html', 6 | styleUrls: ['./app.component.css'] 7 | }) 8 | export class AppComponent { 9 | title = 'input-output-demo'; 10 | } 11 | -------------------------------------------------------------------------------- /input-output-demo/src/app/customer/customer-details/customer-details.component.css: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/DanWahlin/angular-architecture/3075810e55f78dab9bc263849265af3763364ea7/input-output-demo/src/app/customer/customer-details/customer-details.component.css -------------------------------------------------------------------------------- /input-output-demo/src/app/customer/customer-details/customer-details.component.html: -------------------------------------------------------------------------------- 1 | Name: {{ customer.name }} 2 |
3 | City: {{ customer.address.city }} 4 |
5 | -------------------------------------------------------------------------------- /input-output-demo/src/app/customer/customer.component.css: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/DanWahlin/angular-architecture/3075810e55f78dab9bc263849265af3763364ea7/input-output-demo/src/app/customer/customer.component.css -------------------------------------------------------------------------------- /input-output-demo/src/app/customer/customer.component.html: -------------------------------------------------------------------------------- 1 |

Customer

2 |
3 | 4 | -------------------------------------------------------------------------------- /input-output-demo/src/assets/.gitkeep: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/DanWahlin/angular-architecture/3075810e55f78dab9bc263849265af3763364ea7/input-output-demo/src/assets/.gitkeep -------------------------------------------------------------------------------- /input-output-demo/src/environments/environment.prod.ts: -------------------------------------------------------------------------------- 1 | export const environment = { 2 | production: true 3 | }; 4 | -------------------------------------------------------------------------------- /input-output-demo/src/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/DanWahlin/angular-architecture/3075810e55f78dab9bc263849265af3763364ea7/input-output-demo/src/favicon.ico -------------------------------------------------------------------------------- /input-output-demo/src/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | InputOutputDemo 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | -------------------------------------------------------------------------------- /input-output-demo/src/main.ts: -------------------------------------------------------------------------------- 1 | import { enableProdMode } from '@angular/core'; 2 | import { platformBrowserDynamic } from '@angular/platform-browser-dynamic'; 3 | 4 | import { AppModule } from './app/app.module'; 5 | import { environment } from './environments/environment'; 6 | 7 | if (environment.production) { 8 | enableProdMode(); 9 | } 10 | 11 | platformBrowserDynamic().bootstrapModule(AppModule) 12 | .catch(err => console.error(err)); 13 | -------------------------------------------------------------------------------- /input-output-demo/src/styles.css: -------------------------------------------------------------------------------- 1 | /* You can add global styles to this file, and also import other style files */ 2 | -------------------------------------------------------------------------------- /input-output-demo/tsconfig.app.json: -------------------------------------------------------------------------------- 1 | /* To learn more about this file see: https://angular.io/config/tsconfig. */ 2 | { 3 | "extends": "./tsconfig.json", 4 | "compilerOptions": { 5 | "outDir": "./out-tsc/app", 6 | "types": [] 7 | }, 8 | "files": [ 9 | "src/main.ts", 10 | "src/polyfills.ts" 11 | ], 12 | "include": [ 13 | "src/**/*.d.ts" 14 | ] 15 | } 16 | -------------------------------------------------------------------------------- /input-output-demo/tsconfig.spec.json: -------------------------------------------------------------------------------- 1 | /* To learn more about this file see: https://angular.io/config/tsconfig. */ 2 | { 3 | "extends": "./tsconfig.json", 4 | "compilerOptions": { 5 | "outDir": "./out-tsc/spec", 6 | "types": [ 7 | "jasmine" 8 | ] 9 | }, 10 | "files": [ 11 | "src/test.ts", 12 | "src/polyfills.ts" 13 | ], 14 | "include": [ 15 | "src/**/*.spec.ts", 16 | "src/**/*.d.ts" 17 | ] 18 | } 19 | -------------------------------------------------------------------------------- /labs/angular-playground/.editorconfig: -------------------------------------------------------------------------------- 1 | # Editor configuration, see http://editorconfig.org 2 | root = true 3 | 4 | [*] 5 | charset = utf-8 6 | indent_style = space 7 | indent_size = 2 8 | insert_final_newline = true 9 | trim_trailing_whitespace = true 10 | 11 | [*.md] 12 | max_line_length = off 13 | trim_trailing_whitespace = false 14 | -------------------------------------------------------------------------------- /labs/angular-playground/.prettierrc: -------------------------------------------------------------------------------- 1 | { 2 | "tabWidth": 2, 3 | "useTabs": false, 4 | "singleQuote": true 5 | } 6 | -------------------------------------------------------------------------------- /labs/angular-playground/angular-playground.json: -------------------------------------------------------------------------------- 1 | { 2 | "sourceRoots": ["./src"], 3 | "angularCli": { 4 | "appName": "playground" 5 | } 6 | } 7 | -------------------------------------------------------------------------------- /labs/angular-playground/e2e/src/app.e2e-spec.ts: -------------------------------------------------------------------------------- 1 | import { AppPage } from './app.po'; 2 | 3 | describe('workspace-project App', () => { 4 | let page: AppPage; 5 | 6 | beforeEach(() => { 7 | page = new AppPage(); 8 | }); 9 | 10 | it('should display welcome message', () => { 11 | page.navigateTo(); 12 | expect(page.getParagraphText()).toEqual('Welcome to playground-demo!'); 13 | }); 14 | }); 15 | -------------------------------------------------------------------------------- /labs/angular-playground/e2e/src/app.po.ts: -------------------------------------------------------------------------------- 1 | import { browser, by, element } from 'protractor'; 2 | 3 | export class AppPage { 4 | navigateTo() { 5 | return browser.get('/'); 6 | } 7 | 8 | getParagraphText() { 9 | return element(by.css('app-root h1')).getText(); 10 | } 11 | } 12 | -------------------------------------------------------------------------------- /labs/angular-playground/e2e/tsconfig.e2e.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../tsconfig.json", 3 | "compilerOptions": { 4 | "outDir": "../out-tsc/app", 5 | "module": "commonjs", 6 | "target": "es5", 7 | "types": [ 8 | "jasmine", 9 | "jasminewd2", 10 | "node" 11 | ] 12 | } 13 | } -------------------------------------------------------------------------------- /labs/angular-playground/src/app/app.component.html: -------------------------------------------------------------------------------- 1 | 2 | -------------------------------------------------------------------------------- /labs/angular-playground/src/app/app.component.ts: -------------------------------------------------------------------------------- 1 | import { Component } from '@angular/core'; 2 | 3 | @Component({ 4 | selector: 'app-root', 5 | templateUrl: './app.component.html' 6 | }) 7 | export class AppComponent { 8 | 9 | } 10 | -------------------------------------------------------------------------------- /labs/angular-playground/src/app/customers/customers-list/customers-list.component.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 |
NameCity
{{ cust.name }}{{ cust.city }}
11 |
12 | No customers found 13 |
14 | -------------------------------------------------------------------------------- /labs/angular-playground/src/app/customers/customers.component.ts: -------------------------------------------------------------------------------- 1 | import { Component, OnInit } from '@angular/core'; 2 | 3 | @Component({ 4 | selector: 'app-customers', 5 | templateUrl: './customers.component.html' 6 | }) 7 | export class CustomersComponent implements OnInit { 8 | 9 | constructor() { } 10 | 11 | ngOnInit() { 12 | 13 | } 14 | 15 | } 16 | -------------------------------------------------------------------------------- /labs/angular-playground/src/app/customers/orders-list/orders-list.component.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 |
ProductPrice
{{ order.name }}{{ order.price }}
-------------------------------------------------------------------------------- /labs/angular-playground/src/assets/.gitkeep: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/DanWahlin/angular-architecture/3075810e55f78dab9bc263849265af3763364ea7/labs/angular-playground/src/assets/.gitkeep -------------------------------------------------------------------------------- /labs/angular-playground/src/environments/environment.prod.ts: -------------------------------------------------------------------------------- 1 | export const environment = { 2 | production: true 3 | }; 4 | -------------------------------------------------------------------------------- /labs/angular-playground/src/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/DanWahlin/angular-architecture/3075810e55f78dab9bc263849265af3763364ea7/labs/angular-playground/src/favicon.ico -------------------------------------------------------------------------------- /labs/angular-playground/src/main.playground.ts: -------------------------------------------------------------------------------- 1 | import { platformBrowserDynamic } from '@angular/platform-browser-dynamic'; 2 | import { PlaygroundModule } from 'angular-playground'; 3 | 4 | PlaygroundModule 5 | .configure({ 6 | selector: 'app-root', 7 | overlay: false, 8 | modules: [] 9 | }); 10 | 11 | platformBrowserDynamic().bootstrapModule(PlaygroundModule); 12 | -------------------------------------------------------------------------------- /labs/angular-playground/src/styles.css: -------------------------------------------------------------------------------- 1 | /* You can add global styles to this file, and also import other style files */ 2 | .yellow { 3 | background-color: yellow; 4 | } -------------------------------------------------------------------------------- /labs/angular-playground/src/tsconfig.app.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../tsconfig.json", 3 | "compilerOptions": { 4 | "outDir": "../out-tsc/app", 5 | "types": [] 6 | }, 7 | "exclude": [ 8 | "test.ts", 9 | "**/*.spec.ts" 10 | ] 11 | } 12 | -------------------------------------------------------------------------------- /labs/angular-playground/src/tsconfig.spec.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../tsconfig.json", 3 | "compilerOptions": { 4 | "outDir": "../out-tsc/spec", 5 | "types": [ 6 | "jasmine", 7 | "node" 8 | ] 9 | }, 10 | "files": [ 11 | "test.ts", 12 | "polyfills.ts" 13 | ], 14 | "include": [ 15 | "**/*.spec.ts", 16 | "**/*.d.ts" 17 | ] 18 | } 19 | -------------------------------------------------------------------------------- /labs/angular-playground/src/tslint.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../tslint.json", 3 | "rules": { 4 | "directive-selector": [ 5 | true, 6 | "attribute", 7 | "app", 8 | "camelCase" 9 | ], 10 | "component-selector": [ 11 | true, 12 | "element", 13 | "app", 14 | "kebab-case" 15 | ] 16 | } 17 | } 18 | -------------------------------------------------------------------------------- /labs/creating-an-observable-service/.browserslistrc: -------------------------------------------------------------------------------- 1 | # This file is currently used by autoprefixer to adjust CSS to support the below specified browsers 2 | # For additional information regarding the format and rule options, please see: 3 | # https://github.com/browserslist/browserslist#queries 4 | # For IE 9-11 support, please uncomment the last line of the file and adjust as needed 5 | > 0.5% 6 | last 2 versions 7 | Firefox ESR 8 | not dead 9 | # IE 9-11 -------------------------------------------------------------------------------- /labs/creating-an-observable-service/.editorconfig: -------------------------------------------------------------------------------- 1 | # Editor configuration, see http://editorconfig.org 2 | root = true 3 | 4 | [*] 5 | charset = utf-8 6 | indent_style = space 7 | indent_size = 2 8 | insert_final_newline = true 9 | trim_trailing_whitespace = true 10 | 11 | [*.md] 12 | max_line_length = off 13 | trim_trailing_whitespace = false 14 | -------------------------------------------------------------------------------- /labs/creating-an-observable-service/.prettierrc: -------------------------------------------------------------------------------- 1 | { 2 | "tabWidth": 2, 3 | "useTabs": false, 4 | "singleQuote": true 5 | } 6 | -------------------------------------------------------------------------------- /labs/creating-an-observable-service/src/app/app.component.css: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/DanWahlin/angular-architecture/3075810e55f78dab9bc263849265af3763364ea7/labs/creating-an-observable-service/src/app/app.component.css -------------------------------------------------------------------------------- /labs/creating-an-observable-service/src/app/app.component.html: -------------------------------------------------------------------------------- 1 | 2 | 3 |
4 | 5 | 6 | 7 | -------------------------------------------------------------------------------- /labs/creating-an-observable-service/src/app/app.component.ts: -------------------------------------------------------------------------------- 1 | import { Component } from '@angular/core'; 2 | 3 | @Component({ 4 | selector: 'app-root', 5 | templateUrl: './app.component.html', 6 | styleUrls: ['./app.component.css'] 7 | }) 8 | export class AppComponent { 9 | title = 'observable-service'; 10 | } 11 | -------------------------------------------------------------------------------- /labs/creating-an-observable-service/src/app/header/header.component.css: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/DanWahlin/angular-architecture/3075810e55f78dab9bc263849265af3763364ea7/labs/creating-an-observable-service/src/app/header/header.component.css -------------------------------------------------------------------------------- /labs/creating-an-observable-service/src/app/header/header.component.html: -------------------------------------------------------------------------------- 1 |

Cart Items: {{ cartItemsCount }}

2 | -------------------------------------------------------------------------------- /labs/creating-an-observable-service/src/app/products/products.component.css: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/DanWahlin/angular-architecture/3075810e55f78dab9bc263849265af3763364ea7/labs/creating-an-observable-service/src/app/products/products.component.css -------------------------------------------------------------------------------- /labs/creating-an-observable-service/src/app/products/products.component.html: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /labs/creating-an-observable-service/src/assets/.gitkeep: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/DanWahlin/angular-architecture/3075810e55f78dab9bc263849265af3763364ea7/labs/creating-an-observable-service/src/assets/.gitkeep -------------------------------------------------------------------------------- /labs/creating-an-observable-service/src/environments/environment.prod.ts: -------------------------------------------------------------------------------- 1 | export const environment = { 2 | production: true 3 | }; 4 | -------------------------------------------------------------------------------- /labs/creating-an-observable-service/src/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/DanWahlin/angular-architecture/3075810e55f78dab9bc263849265af3763364ea7/labs/creating-an-observable-service/src/favicon.ico -------------------------------------------------------------------------------- /labs/creating-an-observable-service/src/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | ObservableService 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | -------------------------------------------------------------------------------- /labs/creating-an-observable-service/src/styles.css: -------------------------------------------------------------------------------- 1 | /* You can add global styles to this file, and also import other style files */ 2 | -------------------------------------------------------------------------------- /labs/creating-an-observable-service/src/tsconfig.app.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../tsconfig.json", 3 | "compilerOptions": { 4 | "outDir": "../out-tsc/app", 5 | "types": [] 6 | }, 7 | "files": [ 8 | "main.ts", 9 | "polyfills.ts" 10 | ], 11 | "include": [ 12 | "src/**/*.d.ts" 13 | ] 14 | } 15 | -------------------------------------------------------------------------------- /labs/creating-an-observable-service/src/tsconfig.spec.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../tsconfig.json", 3 | "compilerOptions": { 4 | "outDir": "../out-tsc/spec", 5 | "types": [ 6 | "jasmine", 7 | "node" 8 | ] 9 | }, 10 | "files": [ 11 | "test.ts", 12 | "polyfills.ts" 13 | ], 14 | "include": [ 15 | "**/*.spec.ts", 16 | "**/*.d.ts" 17 | ] 18 | } 19 | -------------------------------------------------------------------------------- /labs/creating-an-observable-service/src/tslint.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../tslint.json", 3 | "rules": { 4 | "directive-selector": [ 5 | true, 6 | "attribute", 7 | "app", 8 | "camelCase" 9 | ], 10 | "component-selector": [ 11 | true, 12 | "element", 13 | "app", 14 | "kebab-case" 15 | ] 16 | } 17 | } 18 | -------------------------------------------------------------------------------- /labs/functions-pipes/.browserslistrc: -------------------------------------------------------------------------------- 1 | # This file is currently used by autoprefixer to adjust CSS to support the below specified browsers 2 | # For additional information regarding the format and rule options, please see: 3 | # https://github.com/browserslist/browserslist#queries 4 | # For IE 9-11 support, please uncomment the last line of the file and adjust as needed 5 | > 0.5% 6 | last 2 versions 7 | Firefox ESR 8 | not dead 9 | # IE 9-11 -------------------------------------------------------------------------------- /labs/functions-pipes/.editorconfig: -------------------------------------------------------------------------------- 1 | # Editor configuration, see http://editorconfig.org 2 | root = true 3 | 4 | [*] 5 | charset = utf-8 6 | indent_style = space 7 | indent_size = 2 8 | insert_final_newline = true 9 | trim_trailing_whitespace = true 10 | 11 | [*.md] 12 | max_line_length = off 13 | trim_trailing_whitespace = false 14 | -------------------------------------------------------------------------------- /labs/functions-pipes/.prettierrc: -------------------------------------------------------------------------------- 1 | { 2 | "tabWidth": 2, 3 | "useTabs": false, 4 | "singleQuote": true 5 | } 6 | -------------------------------------------------------------------------------- /labs/functions-pipes/e2e/src/app.e2e-spec.ts: -------------------------------------------------------------------------------- 1 | import { AppPage } from './app.po'; 2 | 3 | describe('workspace-project App', () => { 4 | let page: AppPage; 5 | 6 | beforeEach(() => { 7 | page = new AppPage(); 8 | }); 9 | 10 | it('should display welcome message', () => { 11 | page.navigateTo(); 12 | expect(page.getParagraphText()).toEqual('Welcome to functions-pipes!'); 13 | }); 14 | }); 15 | -------------------------------------------------------------------------------- /labs/functions-pipes/e2e/src/app.po.ts: -------------------------------------------------------------------------------- 1 | import { browser, by, element } from 'protractor'; 2 | 3 | export class AppPage { 4 | navigateTo() { 5 | return browser.get('/'); 6 | } 7 | 8 | getParagraphText() { 9 | return element(by.css('app-root h1')).getText(); 10 | } 11 | } 12 | -------------------------------------------------------------------------------- /labs/functions-pipes/e2e/tsconfig.e2e.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../tsconfig.json", 3 | "compilerOptions": { 4 | "outDir": "../out-tsc/app", 5 | "module": "commonjs", 6 | "target": "es5", 7 | "types": [ 8 | "jasmine", 9 | "jasminewd2", 10 | "node" 11 | ] 12 | } 13 | } -------------------------------------------------------------------------------- /labs/functions-pipes/src/app/app.component.css: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/DanWahlin/angular-architecture/3075810e55f78dab9bc263849265af3763364ea7/labs/functions-pipes/src/app/app.component.css -------------------------------------------------------------------------------- /labs/functions-pipes/src/app/app.component.html: -------------------------------------------------------------------------------- 1 | League: 2 | 6 | 7 |

8 | 9 | @for(team of teams; track team.id){ 10 |
{{ team.name }} {{ winPercentage(team) | percent }}
11 | } 12 | -------------------------------------------------------------------------------- /labs/functions-pipes/src/app/win-percentage.pipe.spec.ts: -------------------------------------------------------------------------------- 1 | import { WinPercentagePipe } from './win-percentage.pipe'; 2 | 3 | describe('WinPercentagePipe', () => { 4 | it('create an instance', () => { 5 | const pipe = new WinPercentagePipe(); 6 | expect(pipe).toBeTruthy(); 7 | }); 8 | }); 9 | -------------------------------------------------------------------------------- /labs/functions-pipes/src/app/win-percentage.pipe.ts: -------------------------------------------------------------------------------- 1 | import { Pipe, PipeTransform } from '@angular/core'; 2 | 3 | @Pipe({ 4 | name: 'winPercentage' 5 | }) 6 | export class WinPercentagePipe implements PipeTransform { 7 | 8 | transform(value: any): any { 9 | console.log('In winPercentage pipe'); 10 | return value.wins/(value.wins + value.losses); 11 | } 12 | 13 | } 14 | -------------------------------------------------------------------------------- /labs/functions-pipes/src/assets/.gitkeep: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/DanWahlin/angular-architecture/3075810e55f78dab9bc263849265af3763364ea7/labs/functions-pipes/src/assets/.gitkeep -------------------------------------------------------------------------------- /labs/functions-pipes/src/environments/environment.prod.ts: -------------------------------------------------------------------------------- 1 | export const environment = { 2 | production: true 3 | }; 4 | -------------------------------------------------------------------------------- /labs/functions-pipes/src/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/DanWahlin/angular-architecture/3075810e55f78dab9bc263849265af3763364ea7/labs/functions-pipes/src/favicon.ico -------------------------------------------------------------------------------- /labs/functions-pipes/src/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | FunctionsPipes 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | -------------------------------------------------------------------------------- /labs/functions-pipes/src/main.ts: -------------------------------------------------------------------------------- 1 | import { enableProdMode } from '@angular/core'; 2 | import { platformBrowserDynamic } from '@angular/platform-browser-dynamic'; 3 | 4 | import { AppModule } from './app/app.module'; 5 | import { environment } from './environments/environment'; 6 | 7 | if (environment.production) { 8 | enableProdMode(); 9 | } 10 | 11 | platformBrowserDynamic().bootstrapModule(AppModule) 12 | .catch(err => console.log(err)); 13 | -------------------------------------------------------------------------------- /labs/functions-pipes/src/styles.css: -------------------------------------------------------------------------------- 1 | /* You can add global styles to this file, and also import other style files */ 2 | -------------------------------------------------------------------------------- /labs/functions-pipes/src/tsconfig.app.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../tsconfig.json", 3 | "compilerOptions": { 4 | "outDir": "../out-tsc/app", 5 | "types": [] 6 | }, 7 | "files": [ 8 | "main.ts", 9 | "polyfills.ts" 10 | ], 11 | "include": [ 12 | "src/**/*.d.ts" 13 | ] 14 | } 15 | -------------------------------------------------------------------------------- /labs/functions-pipes/src/tsconfig.spec.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../tsconfig.json", 3 | "compilerOptions": { 4 | "outDir": "../out-tsc/spec", 5 | "types": [ 6 | "jasmine", 7 | "node" 8 | ] 9 | }, 10 | "files": [ 11 | "test.ts", 12 | "polyfills.ts" 13 | ], 14 | "include": [ 15 | "**/*.spec.ts", 16 | "**/*.d.ts" 17 | ] 18 | } 19 | -------------------------------------------------------------------------------- /labs/functions-pipes/src/tslint.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../tslint.json", 3 | "rules": { 4 | "directive-selector": [ 5 | true, 6 | "attribute", 7 | "app", 8 | "camelCase" 9 | ], 10 | "component-selector": [ 11 | true, 12 | "element", 13 | "app", 14 | "kebab-case" 15 | ] 16 | } 17 | } 18 | -------------------------------------------------------------------------------- /labs/http-interceptors/begin/.editorconfig: -------------------------------------------------------------------------------- 1 | # Editor configuration, see https://editorconfig.org 2 | root = true 3 | 4 | [*] 5 | charset = utf-8 6 | indent_style = space 7 | indent_size = 2 8 | insert_final_newline = true 9 | trim_trailing_whitespace = true 10 | 11 | [*.md] 12 | max_line_length = off 13 | trim_trailing_whitespace = false 14 | -------------------------------------------------------------------------------- /labs/http-interceptors/begin/.prettierrc: -------------------------------------------------------------------------------- 1 | { 2 | "tabWidth": 2, 3 | "useTabs": false, 4 | "singleQuote": true 5 | } 6 | -------------------------------------------------------------------------------- /labs/http-interceptors/begin/README.md: -------------------------------------------------------------------------------- 1 | # Interceptors 2 | -------------------------------------------------------------------------------- /labs/http-interceptors/begin/e2e/src/app.po.ts: -------------------------------------------------------------------------------- 1 | import { browser, by, element } from 'protractor'; 2 | 3 | export class AppPage { 4 | navigateTo(): Promise { 5 | return browser.get(browser.baseUrl) as Promise; 6 | } 7 | 8 | getTitleText(): Promise { 9 | return element(by.css('app-root .content span')).getText() as Promise; 10 | } 11 | } 12 | -------------------------------------------------------------------------------- /labs/http-interceptors/begin/e2e/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../tsconfig.base.json", 3 | "compilerOptions": { 4 | "outDir": "../out-tsc/e2e", 5 | "module": "commonjs", 6 | "target": "es2018", 7 | "types": [ 8 | "jasmine", 9 | "jasminewd2", 10 | "node" 11 | ] 12 | } 13 | } 14 | -------------------------------------------------------------------------------- /labs/http-interceptors/begin/proxy.conf.json: -------------------------------------------------------------------------------- 1 | { 2 | "/api": { 3 | "target": "http://localhost:4400", 4 | "secure": false 5 | } 6 | } 7 | -------------------------------------------------------------------------------- /labs/http-interceptors/begin/routes.json: -------------------------------------------------------------------------------- 1 | { 2 | "/api/*": "/$1", 3 | "/hero": "/heroes" 4 | } 5 | -------------------------------------------------------------------------------- /labs/http-interceptors/begin/src/app/core/hero.ts: -------------------------------------------------------------------------------- 1 | export class Hero { 2 | id: string; 3 | name: string; 4 | description: string; 5 | } 6 | -------------------------------------------------------------------------------- /labs/http-interceptors/begin/src/app/heroes/index.ts: -------------------------------------------------------------------------------- 1 | import { HeroesComponent } from "./heroes.component"; 2 | import { HeroListComponent } from "./hero-list.component"; 3 | 4 | export const heroComponents = [HeroesComponent, HeroListComponent]; 5 | -------------------------------------------------------------------------------- /labs/http-interceptors/begin/src/app/interceptors/auth.service.ts: -------------------------------------------------------------------------------- 1 | import { Injectable } from '@angular/core'; 2 | 3 | @Injectable({ providedIn: 'root' }) 4 | export class AuthService { 5 | getAuthorizationToken() { 6 | return [ 7 | 'Basic your-token-goes-here' 8 | // 'Authorization': 'Basic d2VudHdvcnRobWFuOkNoYW5nZV9tZQ==', 9 | // 'Accept': 'application/json;odata=verbose' 10 | ]; 11 | } 12 | } 13 | -------------------------------------------------------------------------------- /labs/http-interceptors/begin/src/app/store/entity-metadata.ts: -------------------------------------------------------------------------------- 1 | import { EntityMetadataMap } from "@ngrx/data"; 2 | 3 | const entityMetadata: EntityMetadataMap = { 4 | Hero: {} 5 | }; 6 | 7 | const pluralNames = { Hero: "Heroes" }; 8 | 9 | export const entityConfig = { 10 | entityMetadata, 11 | pluralNames 12 | }; 13 | -------------------------------------------------------------------------------- /labs/http-interceptors/begin/src/assets/.gitkeep: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/DanWahlin/angular-architecture/3075810e55f78dab9bc263849265af3763364ea7/labs/http-interceptors/begin/src/assets/.gitkeep -------------------------------------------------------------------------------- /labs/http-interceptors/begin/src/environments/environment.prod.ts: -------------------------------------------------------------------------------- 1 | export const environment = { 2 | production: true, 3 | API: "api" 4 | }; 5 | -------------------------------------------------------------------------------- /labs/http-interceptors/begin/src/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/DanWahlin/angular-architecture/3075810e55f78dab9bc263849265af3763364ea7/labs/http-interceptors/begin/src/favicon.ico -------------------------------------------------------------------------------- /labs/http-interceptors/begin/tsconfig.app.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "./tsconfig.json", 3 | "compilerOptions": { 4 | "outDir": "./out-tsc/app", 5 | "types": [] 6 | }, 7 | "files": [ 8 | "src/main.ts", 9 | "src/polyfills.ts" 10 | ], 11 | "include": [ 12 | "src/**/*.d.ts" 13 | ] 14 | } 15 | -------------------------------------------------------------------------------- /labs/http-interceptors/begin/tsconfig.spec.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "./tsconfig.json", 3 | "compilerOptions": { 4 | "outDir": "./out-tsc/spec", 5 | "types": [ 6 | "jasmine", 7 | "node" 8 | ] 9 | }, 10 | "files": [ 11 | "src/test.ts", 12 | "src/polyfills.ts" 13 | ], 14 | "include": [ 15 | "src/**/*.spec.ts", 16 | "src/**/*.d.ts" 17 | ] 18 | } 19 | -------------------------------------------------------------------------------- /labs/http-interceptors/end/.editorconfig: -------------------------------------------------------------------------------- 1 | # Editor configuration, see https://editorconfig.org 2 | root = true 3 | 4 | [*] 5 | charset = utf-8 6 | indent_style = space 7 | indent_size = 2 8 | insert_final_newline = true 9 | trim_trailing_whitespace = true 10 | 11 | [*.md] 12 | max_line_length = off 13 | trim_trailing_whitespace = false 14 | -------------------------------------------------------------------------------- /labs/http-interceptors/end/.prettierrc: -------------------------------------------------------------------------------- 1 | { 2 | "tabWidth": 2, 3 | "useTabs": false, 4 | "singleQuote": true 5 | } 6 | -------------------------------------------------------------------------------- /labs/http-interceptors/end/README.md: -------------------------------------------------------------------------------- 1 | # Interceptors 2 | -------------------------------------------------------------------------------- /labs/http-interceptors/end/e2e/src/app.po.ts: -------------------------------------------------------------------------------- 1 | import { browser, by, element } from 'protractor'; 2 | 3 | export class AppPage { 4 | navigateTo(): Promise { 5 | return browser.get(browser.baseUrl) as Promise; 6 | } 7 | 8 | getTitleText(): Promise { 9 | return element(by.css('app-root .content span')).getText() as Promise; 10 | } 11 | } 12 | -------------------------------------------------------------------------------- /labs/http-interceptors/end/e2e/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../tsconfig.json", 3 | "compilerOptions": { 4 | "outDir": "../out-tsc/e2e", 5 | "module": "commonjs", 6 | "target": "es2018", 7 | "types": [ 8 | "jasmine", 9 | "jasminewd2", 10 | "node" 11 | ] 12 | } 13 | } 14 | -------------------------------------------------------------------------------- /labs/http-interceptors/end/proxy.conf.json: -------------------------------------------------------------------------------- 1 | { 2 | "/api": { 3 | "target": "http://localhost:4400", 4 | "secure": false 5 | } 6 | } 7 | -------------------------------------------------------------------------------- /labs/http-interceptors/end/routes.json: -------------------------------------------------------------------------------- 1 | { 2 | "/api/*": "/$1", 3 | "/hero": "/heroes" 4 | } 5 | -------------------------------------------------------------------------------- /labs/http-interceptors/end/src/app/core/hero.ts: -------------------------------------------------------------------------------- 1 | export class Hero { 2 | id: string; 3 | name: string; 4 | description: string; 5 | } 6 | -------------------------------------------------------------------------------- /labs/http-interceptors/end/src/app/heroes/index.ts: -------------------------------------------------------------------------------- 1 | import { HeroesComponent } from "./heroes.component"; 2 | import { HeroListComponent } from "./hero-list.component"; 3 | 4 | export const heroComponents = [HeroesComponent, HeroListComponent]; 5 | -------------------------------------------------------------------------------- /labs/http-interceptors/end/src/app/interceptors/auth.service.ts: -------------------------------------------------------------------------------- 1 | import { Injectable } from '@angular/core'; 2 | 3 | @Injectable({ providedIn: 'root' }) 4 | export class AuthService { 5 | getAuthorizationToken() { 6 | return [ 7 | 'Basic your-token-goes-here' 8 | // 'Authorization': 'Basic d2VudHdvcnRobWFuOkNoYW5nZV9tZQ==', 9 | // 'Accept': 'application/json;odata=verbose' 10 | ]; 11 | } 12 | } 13 | -------------------------------------------------------------------------------- /labs/http-interceptors/end/src/app/store/entity-metadata.ts: -------------------------------------------------------------------------------- 1 | import { EntityMetadataMap } from "@ngrx/data"; 2 | 3 | const entityMetadata: EntityMetadataMap = { 4 | Hero: {} 5 | }; 6 | 7 | const pluralNames = { Hero: "Heroes" }; 8 | 9 | export const entityConfig = { 10 | entityMetadata, 11 | pluralNames 12 | }; 13 | -------------------------------------------------------------------------------- /labs/http-interceptors/end/src/assets/.gitkeep: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/DanWahlin/angular-architecture/3075810e55f78dab9bc263849265af3763364ea7/labs/http-interceptors/end/src/assets/.gitkeep -------------------------------------------------------------------------------- /labs/http-interceptors/end/src/environments/environment.prod.ts: -------------------------------------------------------------------------------- 1 | export const environment = { 2 | production: true, 3 | API: "api" 4 | }; 5 | -------------------------------------------------------------------------------- /labs/http-interceptors/end/src/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/DanWahlin/angular-architecture/3075810e55f78dab9bc263849265af3763364ea7/labs/http-interceptors/end/src/favicon.ico -------------------------------------------------------------------------------- /labs/http-interceptors/end/tsconfig.app.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "./tsconfig.json", 3 | "compilerOptions": { 4 | "outDir": "./out-tsc/app", 5 | "types": [] 6 | }, 7 | "files": [ 8 | "src/main.ts", 9 | "src/polyfills.ts" 10 | ], 11 | "include": [ 12 | "src/**/*.d.ts" 13 | ] 14 | } 15 | -------------------------------------------------------------------------------- /labs/http-interceptors/end/tsconfig.spec.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "./tsconfig.json", 3 | "compilerOptions": { 4 | "outDir": "./out-tsc/spec", 5 | "types": [ 6 | "jasmine", 7 | "node" 8 | ] 9 | }, 10 | "files": [ 11 | "src/test.ts", 12 | "src/polyfills.ts" 13 | ], 14 | "include": [ 15 | "src/**/*.spec.ts", 16 | "src/**/*.d.ts" 17 | ] 18 | } 19 | -------------------------------------------------------------------------------- /labs/routing-guards-and-preload-strategies/begin/.editorconfig: -------------------------------------------------------------------------------- 1 | # Editor configuration, see http://editorconfig.org 2 | root = true 3 | 4 | [*] 5 | charset = utf-8 6 | indent_style = space 7 | indent_size = 2 8 | insert_final_newline = true 9 | trim_trailing_whitespace = true 10 | 11 | [*.md] 12 | max_line_length = off 13 | trim_trailing_whitespace = false 14 | -------------------------------------------------------------------------------- /labs/routing-guards-and-preload-strategies/begin/.prettierrc: -------------------------------------------------------------------------------- 1 | { 2 | "tabWidth": 2, 3 | "useTabs": false, 4 | "singleQuote": true 5 | } 6 | -------------------------------------------------------------------------------- /labs/routing-guards-and-preload-strategies/begin/src/app/app.component.html: -------------------------------------------------------------------------------- 1 |
2 | 3 |
4 | 5 |
6 |
7 | -------------------------------------------------------------------------------- /labs/routing-guards-and-preload-strategies/begin/src/app/app.component.scss: -------------------------------------------------------------------------------- 1 | .layout { 2 | margin: 0px; 3 | // flex-flow: column wrap; 4 | display: flex; 5 | min-height: 100vh; 6 | flex-direction: column; 7 | } 8 | .content { 9 | flex: 1; 10 | margin: 0.5em; 11 | } 12 | -------------------------------------------------------------------------------- /labs/routing-guards-and-preload-strategies/begin/src/app/app.component.ts: -------------------------------------------------------------------------------- 1 | import { Component } from '@angular/core'; 2 | 3 | @Component({ 4 | selector: 'app-root', 5 | templateUrl: './app.component.html', 6 | styleUrls: ['./app.component.scss'] 7 | }) 8 | export class AppComponent {} 9 | -------------------------------------------------------------------------------- /labs/routing-guards-and-preload-strategies/begin/src/app/core/index.ts: -------------------------------------------------------------------------------- 1 | export * from "./core.module"; 2 | export * from "./in-memory-data.service"; 3 | export * from "./model"; 4 | export * from "./toast.service"; 5 | export * from "./network-aware-preload-strategy"; 6 | export * from "./opt-in-preload-strategy"; 7 | -------------------------------------------------------------------------------- /labs/routing-guards-and-preload-strategies/begin/src/app/core/model/hero.ts: -------------------------------------------------------------------------------- 1 | export class Hero { 2 | id: number; 3 | name: string; 4 | saying: string; 5 | } 6 | -------------------------------------------------------------------------------- /labs/routing-guards-and-preload-strategies/begin/src/app/core/model/index.ts: -------------------------------------------------------------------------------- 1 | export * from './hero'; 2 | export * from './villain'; 3 | -------------------------------------------------------------------------------- /labs/routing-guards-and-preload-strategies/begin/src/app/core/model/villain.ts: -------------------------------------------------------------------------------- 1 | export class Villain { 2 | id: number; 3 | name: string; 4 | saying: string; 5 | } 6 | -------------------------------------------------------------------------------- /labs/routing-guards-and-preload-strategies/begin/src/app/core/module-import-check.ts: -------------------------------------------------------------------------------- 1 | export function throwIfAlreadyLoaded(parentModule: any, moduleName: string) { 2 | if (parentModule) { 3 | const msg = `${moduleName} has already been loaded. Import Core modules in the AppModule only.`; 4 | throw new Error(msg); 5 | } 6 | } 7 | -------------------------------------------------------------------------------- /labs/routing-guards-and-preload-strategies/begin/src/app/core/toolbar/toolbar.component.ts: -------------------------------------------------------------------------------- 1 | import { Component } from '@angular/core'; 2 | 3 | @Component({ 4 | selector: 'app-toolbar', 5 | templateUrl: './toolbar.component.html', 6 | styleUrls: ['./toolbar.component.scss'] 7 | }) 8 | export class ToolbarComponent { 9 | labTitle = 'routing-guards-and-preload-strategies'; 10 | labState = 'begin'; 11 | } 12 | -------------------------------------------------------------------------------- /labs/routing-guards-and-preload-strategies/begin/src/app/heroes/hero-detail/hero-detail.component.scss: -------------------------------------------------------------------------------- 1 | @import '../../../styles/mixin'; 2 | 3 | .mat-card { 4 | @include mat-card-layout; 5 | @include editarea-margins; 6 | } 7 | -------------------------------------------------------------------------------- /labs/routing-guards-and-preload-strategies/begin/src/app/heroes/hero-list/hero-list.component.scss: -------------------------------------------------------------------------------- 1 | @import '../../../styles/mixin'; 2 | 3 | .heroes { 4 | @include item-list; 5 | } 6 | 7 | .mat-card { 8 | @include mat-card-layout; 9 | } 10 | -------------------------------------------------------------------------------- /labs/routing-guards-and-preload-strategies/begin/src/app/heroes/heroes/heroes.component.scss: -------------------------------------------------------------------------------- 1 | @import '../../../styles/mixin'; 2 | 3 | .control-panel { 4 | @include control-panel-layout; 5 | } 6 | .content-container { 7 | @include content-container-layout; 8 | } 9 | -------------------------------------------------------------------------------- /labs/routing-guards-and-preload-strategies/begin/src/app/heroes/routes.ts: -------------------------------------------------------------------------------- 1 | import { Routes } from '@angular/router'; 2 | 3 | import { HeroesComponent } from './heroes/heroes.component'; 4 | 5 | export const routes: Routes = [ 6 | { path: '', pathMatch: 'full', component: HeroesComponent }, 7 | ]; 8 | -------------------------------------------------------------------------------- /labs/routing-guards-and-preload-strategies/begin/src/app/villains/villain-detail-container/villain-detail-container.component.html: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/DanWahlin/angular-architecture/3075810e55f78dab9bc263849265af3763364ea7/labs/routing-guards-and-preload-strategies/begin/src/app/villains/villain-detail-container/villain-detail-container.component.html -------------------------------------------------------------------------------- /labs/routing-guards-and-preload-strategies/begin/src/app/villains/villain-detail-container/villain-detail-container.component.scss: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/DanWahlin/angular-architecture/3075810e55f78dab9bc263849265af3763364ea7/labs/routing-guards-and-preload-strategies/begin/src/app/villains/villain-detail-container/villain-detail-container.component.scss -------------------------------------------------------------------------------- /labs/routing-guards-and-preload-strategies/begin/src/app/villains/villain-detail/villain-detail.component.scss: -------------------------------------------------------------------------------- 1 | @import '../../../styles/mixin'; 2 | 3 | .mat-card { 4 | @include mat-card-layout; 5 | @include editarea-margins; 6 | } 7 | -------------------------------------------------------------------------------- /labs/routing-guards-and-preload-strategies/begin/src/app/villains/villain-list/villain-list.component.scss: -------------------------------------------------------------------------------- 1 | @import '../../../styles/mixin'; 2 | 3 | .villains { 4 | @include item-list; 5 | } 6 | 7 | .mat-card { 8 | @include mat-card-layout; 9 | } 10 | -------------------------------------------------------------------------------- /labs/routing-guards-and-preload-strategies/begin/src/app/villains/villains/villains.component.scss: -------------------------------------------------------------------------------- 1 | @import '../../../styles/mixin'; 2 | 3 | .control-panel { 4 | @include control-panel-layout; 5 | } 6 | .content-container { 7 | @include content-container-layout; 8 | } 9 | -------------------------------------------------------------------------------- /labs/routing-guards-and-preload-strategies/begin/src/assets/.gitkeep: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/DanWahlin/angular-architecture/3075810e55f78dab9bc263849265af3763364ea7/labs/routing-guards-and-preload-strategies/begin/src/assets/.gitkeep -------------------------------------------------------------------------------- /labs/routing-guards-and-preload-strategies/begin/src/assets/jp-48.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/DanWahlin/angular-architecture/3075810e55f78dab9bc263849265af3763364ea7/labs/routing-guards-and-preload-strategies/begin/src/assets/jp-48.jpg -------------------------------------------------------------------------------- /labs/routing-guards-and-preload-strategies/begin/src/assets/jp.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/DanWahlin/angular-architecture/3075810e55f78dab9bc263849265af3763364ea7/labs/routing-guards-and-preload-strategies/begin/src/assets/jp.jpg -------------------------------------------------------------------------------- /labs/routing-guards-and-preload-strategies/begin/src/assets/ng.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/DanWahlin/angular-architecture/3075810e55f78dab9bc263849265af3763364ea7/labs/routing-guards-and-preload-strategies/begin/src/assets/ng.png -------------------------------------------------------------------------------- /labs/routing-guards-and-preload-strategies/begin/src/assets/wb-48.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/DanWahlin/angular-architecture/3075810e55f78dab9bc263849265af3763364ea7/labs/routing-guards-and-preload-strategies/begin/src/assets/wb-48.jpg -------------------------------------------------------------------------------- /labs/routing-guards-and-preload-strategies/begin/src/assets/wb.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/DanWahlin/angular-architecture/3075810e55f78dab9bc263849265af3763364ea7/labs/routing-guards-and-preload-strategies/begin/src/assets/wb.jpg -------------------------------------------------------------------------------- /labs/routing-guards-and-preload-strategies/begin/src/environments/environment.prod.ts: -------------------------------------------------------------------------------- 1 | export const environment = { 2 | production: true 3 | }; 4 | -------------------------------------------------------------------------------- /labs/routing-guards-and-preload-strategies/begin/src/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/DanWahlin/angular-architecture/3075810e55f78dab9bc263849265af3763364ea7/labs/routing-guards-and-preload-strategies/begin/src/favicon.ico -------------------------------------------------------------------------------- /labs/routing-guards-and-preload-strategies/begin/src/styles.css: -------------------------------------------------------------------------------- 1 | /* You can add global styles to this file, and also import other style files */ 2 | -------------------------------------------------------------------------------- /labs/routing-guards-and-preload-strategies/begin/src/styles/styles.scss: -------------------------------------------------------------------------------- 1 | @import 'mixin'; 2 | 3 | * { 4 | font-family: Arial; 5 | } 6 | h2 { 7 | color: #444; 8 | font-weight: lighter; 9 | } 10 | html, 11 | body { 12 | margin: 0px; 13 | font-family: Arial; 14 | } 15 | 16 | .button-panel > button { 17 | margin-right: 12px; 18 | } 19 | -------------------------------------------------------------------------------- /labs/routing-guards-and-preload-strategies/begin/src/tsconfig.app.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../tsconfig.json", 3 | "compilerOptions": { 4 | "outDir": "../out-tsc/app", 5 | "types": [] 6 | }, 7 | "files": [ 8 | "main.ts", 9 | "polyfills.ts" 10 | ], 11 | "include": [ 12 | "src/**/*.d.ts" 13 | ] 14 | } 15 | -------------------------------------------------------------------------------- /labs/routing-guards-and-preload-strategies/begin/src/tsconfig.spec.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../tsconfig.json", 3 | "compilerOptions": { 4 | "outDir": "../out-tsc/spec", 5 | "types": [ 6 | "jasmine", 7 | "node" 8 | ] 9 | }, 10 | "files": [ 11 | "test.ts", 12 | "polyfills.ts" 13 | ], 14 | "include": [ 15 | "**/*.spec.ts", 16 | "**/*.d.ts" 17 | ] 18 | } 19 | -------------------------------------------------------------------------------- /labs/routing-guards-and-preload-strategies/end/.editorconfig: -------------------------------------------------------------------------------- 1 | # Editor configuration, see http://editorconfig.org 2 | root = true 3 | 4 | [*] 5 | charset = utf-8 6 | indent_style = space 7 | indent_size = 2 8 | insert_final_newline = true 9 | trim_trailing_whitespace = true 10 | 11 | [*.md] 12 | max_line_length = off 13 | trim_trailing_whitespace = false 14 | -------------------------------------------------------------------------------- /labs/routing-guards-and-preload-strategies/end/.prettierrc: -------------------------------------------------------------------------------- 1 | { 2 | "tabWidth": 2, 3 | "useTabs": false, 4 | "singleQuote": true 5 | } 6 | -------------------------------------------------------------------------------- /labs/routing-guards-and-preload-strategies/end/README.md: -------------------------------------------------------------------------------- 1 | # Routing Guards 2 | 3 | -------------------------------------------------------------------------------- /labs/routing-guards-and-preload-strategies/end/src/app/app.component.html: -------------------------------------------------------------------------------- 1 |
2 | 3 |
4 | 5 |
6 |
7 | -------------------------------------------------------------------------------- /labs/routing-guards-and-preload-strategies/end/src/app/app.component.scss: -------------------------------------------------------------------------------- 1 | .layout { 2 | margin: 0px; 3 | // flex-flow: column wrap; 4 | display: flex; 5 | min-height: 100vh; 6 | flex-direction: column; 7 | } 8 | .content { 9 | flex: 1; 10 | margin: 0.5em; 11 | } 12 | -------------------------------------------------------------------------------- /labs/routing-guards-and-preload-strategies/end/src/app/app.component.ts: -------------------------------------------------------------------------------- 1 | import { Component } from '@angular/core'; 2 | 3 | @Component({ 4 | selector: 'app-root', 5 | templateUrl: './app.component.html', 6 | styleUrls: ['./app.component.scss'] 7 | }) 8 | export class AppComponent {} 9 | -------------------------------------------------------------------------------- /labs/routing-guards-and-preload-strategies/end/src/app/core/auth.guard.ts: -------------------------------------------------------------------------------- 1 | export const authGuard = () => { 2 | return true; 3 | }; 4 | -------------------------------------------------------------------------------- /labs/routing-guards-and-preload-strategies/end/src/app/core/index.ts: -------------------------------------------------------------------------------- 1 | export * from "./core.module"; 2 | export * from "./in-memory-data.service"; 3 | export * from "./model"; 4 | export * from "./toast.service"; 5 | export * from "./network-aware-preload-strategy"; 6 | export * from "./opt-in-preload-strategy"; 7 | -------------------------------------------------------------------------------- /labs/routing-guards-and-preload-strategies/end/src/app/core/model/hero.ts: -------------------------------------------------------------------------------- 1 | export class Hero { 2 | id: number; 3 | name: string; 4 | saying: string; 5 | } 6 | -------------------------------------------------------------------------------- /labs/routing-guards-and-preload-strategies/end/src/app/core/model/index.ts: -------------------------------------------------------------------------------- 1 | export * from './hero'; 2 | export * from './villain'; 3 | -------------------------------------------------------------------------------- /labs/routing-guards-and-preload-strategies/end/src/app/core/model/villain.ts: -------------------------------------------------------------------------------- 1 | export class Villain { 2 | id: number; 3 | name: string; 4 | saying: string; 5 | } 6 | -------------------------------------------------------------------------------- /labs/routing-guards-and-preload-strategies/end/src/app/core/module-import-check.ts: -------------------------------------------------------------------------------- 1 | export function throwIfAlreadyLoaded(parentModule: any, moduleName: string) { 2 | if (parentModule) { 3 | const msg = `${moduleName} has already been loaded. Import Core modules in the AppModule only.`; 4 | throw new Error(msg); 5 | } 6 | } 7 | -------------------------------------------------------------------------------- /labs/routing-guards-and-preload-strategies/end/src/app/core/toolbar/toolbar.component.ts: -------------------------------------------------------------------------------- 1 | import { Component } from '@angular/core'; 2 | 3 | @Component({ 4 | selector: 'app-toolbar', 5 | templateUrl: './toolbar.component.html', 6 | styleUrls: ['./toolbar.component.scss'] 7 | }) 8 | export class ToolbarComponent { 9 | labTitle = 'routing-guards-and-preload-strategies'; 10 | labState = 'end'; 11 | } 12 | -------------------------------------------------------------------------------- /labs/routing-guards-and-preload-strategies/end/src/app/heroes/hero-detail/hero-detail.component.scss: -------------------------------------------------------------------------------- 1 | @import '../../../styles/mixin'; 2 | 3 | .mat-card { 4 | @include mat-card-layout; 5 | @include editarea-margins; 6 | } 7 | -------------------------------------------------------------------------------- /labs/routing-guards-and-preload-strategies/end/src/app/heroes/hero-list/hero-list.component.scss: -------------------------------------------------------------------------------- 1 | @import '../../../styles/mixin'; 2 | 3 | .heroes { 4 | @include item-list; 5 | } 6 | 7 | .mat-card { 8 | @include mat-card-layout; 9 | } 10 | -------------------------------------------------------------------------------- /labs/routing-guards-and-preload-strategies/end/src/app/heroes/heroes/heroes.component.scss: -------------------------------------------------------------------------------- 1 | @import '../../../styles/mixin'; 2 | 3 | .control-panel { 4 | @include control-panel-layout; 5 | } 6 | .content-container { 7 | @include content-container-layout; 8 | } 9 | -------------------------------------------------------------------------------- /labs/routing-guards-and-preload-strategies/end/src/app/heroes/routes.ts: -------------------------------------------------------------------------------- 1 | import { Routes } from '@angular/router'; 2 | 3 | import { HeroesComponent } from './heroes/heroes.component'; 4 | 5 | export const routes: Routes = [ 6 | { path: '', pathMatch: 'full', component: HeroesComponent }, 7 | ]; 8 | -------------------------------------------------------------------------------- /labs/routing-guards-and-preload-strategies/end/src/app/villains/villain-detail-container/villain-detail-container.component.html: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/DanWahlin/angular-architecture/3075810e55f78dab9bc263849265af3763364ea7/labs/routing-guards-and-preload-strategies/end/src/app/villains/villain-detail-container/villain-detail-container.component.html -------------------------------------------------------------------------------- /labs/routing-guards-and-preload-strategies/end/src/app/villains/villain-detail-container/villain-detail-container.component.scss: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/DanWahlin/angular-architecture/3075810e55f78dab9bc263849265af3763364ea7/labs/routing-guards-and-preload-strategies/end/src/app/villains/villain-detail-container/villain-detail-container.component.scss -------------------------------------------------------------------------------- /labs/routing-guards-and-preload-strategies/end/src/app/villains/villain-detail/villain-detail.component.scss: -------------------------------------------------------------------------------- 1 | @import '../../../styles/mixin'; 2 | 3 | .mat-card { 4 | @include mat-card-layout; 5 | @include editarea-margins; 6 | } 7 | -------------------------------------------------------------------------------- /labs/routing-guards-and-preload-strategies/end/src/app/villains/villain-list/villain-list.component.scss: -------------------------------------------------------------------------------- 1 | @import '../../../styles/mixin'; 2 | 3 | .villains { 4 | @include item-list; 5 | } 6 | 7 | .mat-card { 8 | @include mat-card-layout; 9 | } 10 | -------------------------------------------------------------------------------- /labs/routing-guards-and-preload-strategies/end/src/app/villains/villains/villains.component.scss: -------------------------------------------------------------------------------- 1 | @import '../../../styles/mixin'; 2 | 3 | .control-panel { 4 | @include control-panel-layout; 5 | } 6 | .content-container { 7 | @include content-container-layout; 8 | } 9 | -------------------------------------------------------------------------------- /labs/routing-guards-and-preload-strategies/end/src/assets/.gitkeep: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/DanWahlin/angular-architecture/3075810e55f78dab9bc263849265af3763364ea7/labs/routing-guards-and-preload-strategies/end/src/assets/.gitkeep -------------------------------------------------------------------------------- /labs/routing-guards-and-preload-strategies/end/src/assets/jp-48.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/DanWahlin/angular-architecture/3075810e55f78dab9bc263849265af3763364ea7/labs/routing-guards-and-preload-strategies/end/src/assets/jp-48.jpg -------------------------------------------------------------------------------- /labs/routing-guards-and-preload-strategies/end/src/assets/jp.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/DanWahlin/angular-architecture/3075810e55f78dab9bc263849265af3763364ea7/labs/routing-guards-and-preload-strategies/end/src/assets/jp.jpg -------------------------------------------------------------------------------- /labs/routing-guards-and-preload-strategies/end/src/assets/ng.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/DanWahlin/angular-architecture/3075810e55f78dab9bc263849265af3763364ea7/labs/routing-guards-and-preload-strategies/end/src/assets/ng.png -------------------------------------------------------------------------------- /labs/routing-guards-and-preload-strategies/end/src/assets/wb-48.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/DanWahlin/angular-architecture/3075810e55f78dab9bc263849265af3763364ea7/labs/routing-guards-and-preload-strategies/end/src/assets/wb-48.jpg -------------------------------------------------------------------------------- /labs/routing-guards-and-preload-strategies/end/src/assets/wb.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/DanWahlin/angular-architecture/3075810e55f78dab9bc263849265af3763364ea7/labs/routing-guards-and-preload-strategies/end/src/assets/wb.jpg -------------------------------------------------------------------------------- /labs/routing-guards-and-preload-strategies/end/src/environments/environment.prod.ts: -------------------------------------------------------------------------------- 1 | export const environment = { 2 | production: true 3 | }; 4 | -------------------------------------------------------------------------------- /labs/routing-guards-and-preload-strategies/end/src/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/DanWahlin/angular-architecture/3075810e55f78dab9bc263849265af3763364ea7/labs/routing-guards-and-preload-strategies/end/src/favicon.ico -------------------------------------------------------------------------------- /labs/routing-guards-and-preload-strategies/end/src/styles.css: -------------------------------------------------------------------------------- 1 | /* You can add global styles to this file, and also import other style files */ 2 | -------------------------------------------------------------------------------- /labs/routing-guards-and-preload-strategies/end/src/styles/styles.scss: -------------------------------------------------------------------------------- 1 | @import 'mixin'; 2 | 3 | * { 4 | font-family: Arial; 5 | } 6 | h2 { 7 | color: #444; 8 | font-weight: lighter; 9 | } 10 | html, 11 | body { 12 | margin: 0px; 13 | font-family: Arial; 14 | } 15 | 16 | .button-panel > button { 17 | margin-right: 12px; 18 | } 19 | -------------------------------------------------------------------------------- /labs/routing-guards-and-preload-strategies/end/src/tsconfig.app.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../tsconfig.json", 3 | "compilerOptions": { 4 | "outDir": "../out-tsc/app", 5 | "types": [] 6 | }, 7 | "files": [ 8 | "main.ts", 9 | "polyfills.ts" 10 | ], 11 | "include": [ 12 | "src/**/*.d.ts" 13 | ] 14 | } 15 | -------------------------------------------------------------------------------- /labs/routing-guards-and-preload-strategies/end/src/tsconfig.spec.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../tsconfig.json", 3 | "compilerOptions": { 4 | "outDir": "../out-tsc/spec", 5 | "types": [ 6 | "jasmine", 7 | "node" 8 | ] 9 | }, 10 | "files": [ 11 | "test.ts", 12 | "polyfills.ts" 13 | ], 14 | "include": [ 15 | "**/*.spec.ts", 16 | "**/*.d.ts" 17 | ] 18 | } 19 | -------------------------------------------------------------------------------- /labs/routing-guards-and-preload-strategies/end/src/tslint.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../tslint.json", 3 | "rules": { 4 | "directive-selector": [ 5 | true, 6 | "attribute", 7 | "app", 8 | "camelCase" 9 | ], 10 | "component-selector": [ 11 | true, 12 | "element", 13 | "app", 14 | "kebab-case" 15 | ] 16 | } 17 | } 18 | -------------------------------------------------------------------------------- /labs/rxjs-subjects/begin/.editorconfig: -------------------------------------------------------------------------------- 1 | # Editor configuration, see https://editorconfig.org 2 | root = true 3 | 4 | [*] 5 | charset = utf-8 6 | indent_style = space 7 | indent_size = 2 8 | insert_final_newline = true 9 | trim_trailing_whitespace = true 10 | 11 | [*.md] 12 | max_line_length = off 13 | trim_trailing_whitespace = false 14 | -------------------------------------------------------------------------------- /labs/rxjs-subjects/begin/.prettierrc: -------------------------------------------------------------------------------- 1 | { 2 | "tabWidth": 2, 3 | "useTabs": false, 4 | "singleQuote": true 5 | } 6 | -------------------------------------------------------------------------------- /labs/rxjs-subjects/begin/e2e/src/app.e2e-spec.ts: -------------------------------------------------------------------------------- 1 | import { AppPage } from './app.po'; 2 | 3 | describe('workspace-project App', () => { 4 | let page: AppPage; 5 | 6 | beforeEach(() => { 7 | page = new AppPage(); 8 | }); 9 | 10 | it('should display welcome message', () => { 11 | page.navigateTo(); 12 | expect(page.getTitleText()).toEqual('Welcome to rxjs-subjects!'); 13 | }); 14 | }); 15 | -------------------------------------------------------------------------------- /labs/rxjs-subjects/begin/e2e/src/app.po.ts: -------------------------------------------------------------------------------- 1 | import { browser, by, element } from 'protractor'; 2 | 3 | export class AppPage { 4 | navigateTo() { 5 | return browser.get('/'); 6 | } 7 | 8 | getTitleText() { 9 | return element(by.css('app-root h1')).getText(); 10 | } 11 | } 12 | -------------------------------------------------------------------------------- /labs/rxjs-subjects/begin/e2e/tsconfig.e2e.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../tsconfig.json", 3 | "compilerOptions": { 4 | "outDir": "../out-tsc/app", 5 | "module": "commonjs", 6 | "target": "es5", 7 | "types": [ 8 | "jasmine", 9 | "jasminewd2", 10 | "node" 11 | ] 12 | } 13 | } -------------------------------------------------------------------------------- /labs/rxjs-subjects/begin/src/app/app.component.css: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/DanWahlin/angular-architecture/3075810e55f78dab9bc263849265af3763364ea7/labs/rxjs-subjects/begin/src/app/app.component.css -------------------------------------------------------------------------------- /labs/rxjs-subjects/begin/src/app/app.module.ts: -------------------------------------------------------------------------------- 1 | import { BrowserModule } from '@angular/platform-browser'; 2 | import { NgModule } from '@angular/core'; 3 | 4 | import { AppComponent } from './app.component'; 5 | 6 | @NgModule({ 7 | declarations: [ 8 | AppComponent 9 | ], 10 | imports: [ 11 | BrowserModule 12 | ], 13 | providers: [], 14 | bootstrap: [AppComponent] 15 | }) 16 | export class AppModule { } 17 | -------------------------------------------------------------------------------- /labs/rxjs-subjects/begin/src/assets/.gitkeep: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/DanWahlin/angular-architecture/3075810e55f78dab9bc263849265af3763364ea7/labs/rxjs-subjects/begin/src/assets/.gitkeep -------------------------------------------------------------------------------- /labs/rxjs-subjects/begin/src/environments/environment.prod.ts: -------------------------------------------------------------------------------- 1 | export const environment = { 2 | production: true 3 | }; 4 | -------------------------------------------------------------------------------- /labs/rxjs-subjects/begin/src/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/DanWahlin/angular-architecture/3075810e55f78dab9bc263849265af3763364ea7/labs/rxjs-subjects/begin/src/favicon.ico -------------------------------------------------------------------------------- /labs/rxjs-subjects/begin/src/styles.css: -------------------------------------------------------------------------------- 1 | /* You can add global styles to this file, and also import other style files */ 2 | body { 3 | background-color: #efefef; 4 | } 5 | 6 | main { 7 | background-color: #fff; 8 | height: 100vh; 9 | } -------------------------------------------------------------------------------- /labs/rxjs-subjects/begin/src/tsconfig.app.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../tsconfig.json", 3 | "compilerOptions": { 4 | "outDir": "../out-tsc/app", 5 | "types": [] 6 | }, 7 | "files": [ 8 | "main.ts", 9 | "polyfills.ts" 10 | ], 11 | "include": [ 12 | "src/**/*.d.ts" 13 | ] 14 | } 15 | -------------------------------------------------------------------------------- /labs/rxjs-subjects/begin/src/tsconfig.spec.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../tsconfig.json", 3 | "compilerOptions": { 4 | "outDir": "../out-tsc/spec", 5 | "types": [ 6 | "jasmine", 7 | "node" 8 | ] 9 | }, 10 | "files": [ 11 | "test.ts", 12 | "polyfills.ts" 13 | ], 14 | "include": [ 15 | "**/*.spec.ts", 16 | "**/*.d.ts" 17 | ] 18 | } 19 | -------------------------------------------------------------------------------- /labs/rxjs-subjects/begin/src/tslint.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../tslint.json", 3 | "rules": { 4 | "directive-selector": [ 5 | true, 6 | "attribute", 7 | "app", 8 | "camelCase" 9 | ], 10 | "component-selector": [ 11 | true, 12 | "element", 13 | "app", 14 | "kebab-case" 15 | ] 16 | } 17 | } 18 | -------------------------------------------------------------------------------- /labs/rxjs-subjects/end/.editorconfig: -------------------------------------------------------------------------------- 1 | # Editor configuration, see https://editorconfig.org 2 | root = true 3 | 4 | [*] 5 | charset = utf-8 6 | indent_style = space 7 | indent_size = 2 8 | insert_final_newline = true 9 | trim_trailing_whitespace = true 10 | 11 | [*.md] 12 | max_line_length = off 13 | trim_trailing_whitespace = false 14 | -------------------------------------------------------------------------------- /labs/rxjs-subjects/end/.prettierrc: -------------------------------------------------------------------------------- 1 | { 2 | "tabWidth": 2, 3 | "useTabs": false, 4 | "singleQuote": true 5 | } 6 | -------------------------------------------------------------------------------- /labs/rxjs-subjects/end/e2e/src/app.e2e-spec.ts: -------------------------------------------------------------------------------- 1 | import { AppPage } from './app.po'; 2 | 3 | describe('workspace-project App', () => { 4 | let page: AppPage; 5 | 6 | beforeEach(() => { 7 | page = new AppPage(); 8 | }); 9 | 10 | it('should display welcome message', () => { 11 | page.navigateTo(); 12 | expect(page.getTitleText()).toEqual('Welcome to rxjs-subjects!'); 13 | }); 14 | }); 15 | -------------------------------------------------------------------------------- /labs/rxjs-subjects/end/e2e/src/app.po.ts: -------------------------------------------------------------------------------- 1 | import { browser, by, element } from 'protractor'; 2 | 3 | export class AppPage { 4 | navigateTo() { 5 | return browser.get('/'); 6 | } 7 | 8 | getTitleText() { 9 | return element(by.css('app-root h1')).getText(); 10 | } 11 | } 12 | -------------------------------------------------------------------------------- /labs/rxjs-subjects/end/e2e/tsconfig.e2e.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../tsconfig.json", 3 | "compilerOptions": { 4 | "outDir": "../out-tsc/app", 5 | "module": "commonjs", 6 | "target": "es5", 7 | "types": [ 8 | "jasmine", 9 | "jasminewd2", 10 | "node" 11 | ] 12 | } 13 | } -------------------------------------------------------------------------------- /labs/rxjs-subjects/end/src/app/app.component.css: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/DanWahlin/angular-architecture/3075810e55f78dab9bc263849265af3763364ea7/labs/rxjs-subjects/end/src/app/app.component.css -------------------------------------------------------------------------------- /labs/rxjs-subjects/end/src/app/app.module.ts: -------------------------------------------------------------------------------- 1 | import { BrowserModule } from '@angular/platform-browser'; 2 | import { NgModule } from '@angular/core'; 3 | 4 | import { AppComponent } from './app.component'; 5 | 6 | @NgModule({ 7 | declarations: [ 8 | AppComponent 9 | ], 10 | imports: [ 11 | BrowserModule 12 | ], 13 | providers: [], 14 | bootstrap: [AppComponent] 15 | }) 16 | export class AppModule { } 17 | -------------------------------------------------------------------------------- /labs/rxjs-subjects/end/src/assets/.gitkeep: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/DanWahlin/angular-architecture/3075810e55f78dab9bc263849265af3763364ea7/labs/rxjs-subjects/end/src/assets/.gitkeep -------------------------------------------------------------------------------- /labs/rxjs-subjects/end/src/environments/environment.prod.ts: -------------------------------------------------------------------------------- 1 | export const environment = { 2 | production: true 3 | }; 4 | -------------------------------------------------------------------------------- /labs/rxjs-subjects/end/src/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/DanWahlin/angular-architecture/3075810e55f78dab9bc263849265af3763364ea7/labs/rxjs-subjects/end/src/favicon.ico -------------------------------------------------------------------------------- /labs/rxjs-subjects/end/src/styles.css: -------------------------------------------------------------------------------- 1 | /* You can add global styles to this file, and also import other style files */ 2 | body { 3 | background-color: #efefef; 4 | } 5 | 6 | main { 7 | background-color: #fff; 8 | height: 100vh; 9 | } -------------------------------------------------------------------------------- /labs/rxjs-subjects/end/src/tsconfig.app.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../tsconfig.json", 3 | "compilerOptions": { 4 | "outDir": "../out-tsc/app", 5 | "types": [] 6 | }, 7 | "files": [ 8 | "main.ts", 9 | "polyfills.ts" 10 | ], 11 | "include": [ 12 | "src/**/*.d.ts" 13 | ] 14 | } 15 | -------------------------------------------------------------------------------- /labs/rxjs-subjects/end/src/tsconfig.spec.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../tsconfig.json", 3 | "compilerOptions": { 4 | "outDir": "../out-tsc/spec", 5 | "types": [ 6 | "jasmine", 7 | "node" 8 | ] 9 | }, 10 | "files": [ 11 | "test.ts", 12 | "polyfills.ts" 13 | ], 14 | "include": [ 15 | "**/*.spec.ts", 16 | "**/*.d.ts" 17 | ] 18 | } 19 | -------------------------------------------------------------------------------- /labs/rxjs-subjects/end/src/tslint.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../tslint.json", 3 | "rules": { 4 | "directive-selector": [ 5 | true, 6 | "attribute", 7 | "app", 8 | "camelCase" 9 | ], 10 | "component-selector": [ 11 | true, 12 | "element", 13 | "app", 14 | "kebab-case" 15 | ] 16 | } 17 | } 18 | -------------------------------------------------------------------------------- /labs/shared-project/.editorconfig: -------------------------------------------------------------------------------- 1 | # Editor configuration, see https://editorconfig.org 2 | root = true 3 | 4 | [*] 5 | charset = utf-8 6 | indent_style = space 7 | indent_size = 2 8 | insert_final_newline = true 9 | trim_trailing_whitespace = true 10 | 11 | [*.ts] 12 | quote_type = single 13 | 14 | [*.md] 15 | max_line_length = off 16 | trim_trailing_whitespace = false 17 | -------------------------------------------------------------------------------- /labs/shared-project/projects/shared-lib/ng-package.json: -------------------------------------------------------------------------------- 1 | { 2 | "$schema": "../../node_modules/ng-packagr/ng-package.schema.json", 3 | "dest": "../../dist/shared-lib", 4 | "lib": { 5 | "entryFile": "src/public-api.ts" 6 | } 7 | } -------------------------------------------------------------------------------- /labs/shared-project/projects/shared-lib/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "shared-lib", 3 | "version": "0.0.1", 4 | "peerDependencies": { 5 | "@angular/common": "^16.0.3", 6 | "@angular/core": "^16.0.3" 7 | }, 8 | "dependencies": { 9 | "tslib": "^2.5.2" 10 | } 11 | } 12 | -------------------------------------------------------------------------------- /labs/shared-project/projects/shared-lib/src/lib/shared-lib.component.ts: -------------------------------------------------------------------------------- 1 | import { Component, OnInit } from '@angular/core'; 2 | 3 | @Component({ 4 | selector: 'lib-shared-lib', 5 | template: ` 6 |

7 | shared-lib works! 8 |

9 | `, 10 | styles: [ 11 | ] 12 | }) 13 | export class SharedLibComponent implements OnInit { 14 | 15 | constructor() { } 16 | 17 | ngOnInit(): void { 18 | } 19 | 20 | } 21 | -------------------------------------------------------------------------------- /labs/shared-project/projects/shared-lib/src/lib/shared-lib.module.ts: -------------------------------------------------------------------------------- 1 | import { NgModule } from '@angular/core'; 2 | import { SharedLibComponent } from './shared-lib.component'; 3 | 4 | 5 | 6 | @NgModule({ 7 | declarations: [SharedLibComponent], 8 | imports: [ 9 | ], 10 | exports: [SharedLibComponent] 11 | }) 12 | export class SharedLibModule { } 13 | -------------------------------------------------------------------------------- /labs/shared-project/projects/shared-lib/src/lib/shared-lib.service.ts: -------------------------------------------------------------------------------- 1 | import { Injectable } from '@angular/core'; 2 | 3 | @Injectable({ 4 | providedIn: 'root' 5 | }) 6 | export class SharedLibService { 7 | 8 | constructor() { } 9 | } 10 | -------------------------------------------------------------------------------- /labs/shared-project/projects/shared-lib/src/public-api.ts: -------------------------------------------------------------------------------- 1 | /* 2 | * Public API Surface of shared-lib 3 | */ 4 | 5 | export * from './lib/shared-lib.service'; 6 | export * from './lib/shared-lib.component'; 7 | export * from './lib/shared-lib.module'; 8 | -------------------------------------------------------------------------------- /labs/shared-project/projects/shared-lib/tsconfig.lib.prod.json: -------------------------------------------------------------------------------- 1 | /* To learn more about this file see: https://angular.io/config/tsconfig. */ 2 | { 3 | "extends": "./tsconfig.lib.json", 4 | "compilerOptions": { 5 | "declarationMap": false 6 | }, 7 | "angularCompilerOptions": { 8 | "compilationMode": "partial" 9 | } 10 | } 11 | -------------------------------------------------------------------------------- /labs/shared-project/projects/shared-lib/tsconfig.spec.json: -------------------------------------------------------------------------------- 1 | /* To learn more about this file see: https://angular.io/config/tsconfig. */ 2 | { 3 | "extends": "../../tsconfig.json", 4 | "compilerOptions": { 5 | "outDir": "../../out-tsc/spec", 6 | "types": [ 7 | "jasmine" 8 | ] 9 | }, 10 | "files": [ 11 | "src/test.ts" 12 | ], 13 | "include": [ 14 | "**/*.spec.ts", 15 | "**/*.d.ts" 16 | ] 17 | } 18 | -------------------------------------------------------------------------------- /labs/shared-project/projects/shared-lib/tslint.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../tslint.json", 3 | "rules": { 4 | "directive-selector": [ 5 | true, 6 | "attribute", 7 | "lib", 8 | "camelCase" 9 | ], 10 | "component-selector": [ 11 | true, 12 | "element", 13 | "lib", 14 | "kebab-case" 15 | ] 16 | } 17 | } 18 | -------------------------------------------------------------------------------- /labs/shared-project/src/app/app.component.css: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/DanWahlin/angular-architecture/3075810e55f78dab9bc263849265af3763364ea7/labs/shared-project/src/app/app.component.css -------------------------------------------------------------------------------- /labs/shared-project/src/app/app.component.ts: -------------------------------------------------------------------------------- 1 | import { Component } from '@angular/core'; 2 | 3 | @Component({ 4 | selector: 'app-root', 5 | templateUrl: './app.component.html', 6 | styleUrls: ['./app.component.css'], 7 | }) 8 | export class AppComponent { 9 | title = 'shared-project'; 10 | } 11 | -------------------------------------------------------------------------------- /labs/shared-project/src/assets/.gitkeep: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/DanWahlin/angular-architecture/3075810e55f78dab9bc263849265af3763364ea7/labs/shared-project/src/assets/.gitkeep -------------------------------------------------------------------------------- /labs/shared-project/src/environments/environment.prod.ts: -------------------------------------------------------------------------------- 1 | export const environment = { 2 | production: true 3 | }; 4 | -------------------------------------------------------------------------------- /labs/shared-project/src/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/DanWahlin/angular-architecture/3075810e55f78dab9bc263849265af3763364ea7/labs/shared-project/src/favicon.ico -------------------------------------------------------------------------------- /labs/shared-project/src/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | SharedProject 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | -------------------------------------------------------------------------------- /labs/shared-project/src/styles.css: -------------------------------------------------------------------------------- 1 | /* You can add global styles to this file, and also import other style files */ 2 | -------------------------------------------------------------------------------- /labs/shared-project/tsconfig.app.json: -------------------------------------------------------------------------------- 1 | /* To learn more about this file see: https://angular.io/config/tsconfig. */ 2 | { 3 | "extends": "./tsconfig.json", 4 | "compilerOptions": { 5 | "outDir": "./out-tsc/app", 6 | "types": [] 7 | }, 8 | "files": [ 9 | "src/main.ts", 10 | "src/polyfills.ts" 11 | ], 12 | "include": [ 13 | "src/**/*.d.ts" 14 | ] 15 | } 16 | -------------------------------------------------------------------------------- /labs/shared-project/tsconfig.spec.json: -------------------------------------------------------------------------------- 1 | /* To learn more about this file see: https://angular.io/config/tsconfig. */ 2 | { 3 | "extends": "./tsconfig.json", 4 | "compilerOptions": { 5 | "outDir": "./out-tsc/spec", 6 | "types": [ 7 | "jasmine" 8 | ] 9 | }, 10 | "files": [ 11 | "src/test.ts", 12 | "src/polyfills.ts" 13 | ], 14 | "include": [ 15 | "src/**/*.spec.ts", 16 | "src/**/*.d.ts" 17 | ] 18 | } 19 | -------------------------------------------------------------------------------- /labs/standalone/begin/.browserslistrc: -------------------------------------------------------------------------------- 1 | # This file is currently used by autoprefixer to adjust CSS to support the below specified browsers 2 | # For additional information regarding the format and rule options, please see: 3 | # https://github.com/browserslist/browserslist#queries 4 | # For IE 9-11 support, please uncomment the last line of the file and adjust as needed 5 | > 0.5% 6 | last 2 versions 7 | Firefox ESR 8 | not dead 9 | # IE 9-11 -------------------------------------------------------------------------------- /labs/standalone/begin/.editorconfig: -------------------------------------------------------------------------------- 1 | # Editor configuration, see http://editorconfig.org 2 | root = true 3 | 4 | [*] 5 | charset = utf-8 6 | indent_style = space 7 | indent_size = 2 8 | insert_final_newline = true 9 | trim_trailing_whitespace = true 10 | 11 | [*.md] 12 | max_line_length = off 13 | trim_trailing_whitespace = false 14 | -------------------------------------------------------------------------------- /labs/standalone/begin/.prettierrc: -------------------------------------------------------------------------------- 1 | { 2 | "tabWidth": 2, 3 | "useTabs": false, 4 | "singleQuote": true 5 | } 6 | -------------------------------------------------------------------------------- /labs/standalone/begin/src/app/app.component.scss: -------------------------------------------------------------------------------- 1 | .layout { 2 | margin: 0px; 3 | // flex-flow: column wrap; 4 | display: flex; 5 | min-height: 100vh; 6 | flex-direction: column; 7 | } 8 | .content { 9 | flex: 1; 10 | margin: 0.5em; 11 | } 12 | -------------------------------------------------------------------------------- /labs/standalone/begin/src/app/core/auth.guard.ts: -------------------------------------------------------------------------------- 1 | export const authGuard = () => { 2 | return true; 3 | }; 4 | -------------------------------------------------------------------------------- /labs/standalone/begin/src/app/core/index.ts: -------------------------------------------------------------------------------- 1 | export * from "./core.module"; // <-- DELETE THIS CORE MODULE EXPORT 2 | export * from "./in-memory-data.service"; 3 | export * from "./model"; 4 | export * from "./network-aware-preload-strategy"; 5 | export * from "./opt-in-preload-strategy"; 6 | export * from "./toast.service"; 7 | -------------------------------------------------------------------------------- /labs/standalone/begin/src/app/core/model/hero.ts: -------------------------------------------------------------------------------- 1 | export class Hero { 2 | id: number; 3 | name: string; 4 | saying: string; 5 | } 6 | -------------------------------------------------------------------------------- /labs/standalone/begin/src/app/core/model/index.ts: -------------------------------------------------------------------------------- 1 | export * from './hero'; 2 | export * from './villain'; 3 | -------------------------------------------------------------------------------- /labs/standalone/begin/src/app/core/model/villain.ts: -------------------------------------------------------------------------------- 1 | export class Villain { 2 | id: number; 3 | name: string; 4 | saying: string; 5 | } 6 | -------------------------------------------------------------------------------- /labs/standalone/begin/src/app/core/module-import-check copy.ts: -------------------------------------------------------------------------------- 1 | export function throwIfAlreadyLoaded(parentModule: any, moduleName: string) { 2 | if (parentModule) { 3 | const msg = `${moduleName} has already been loaded. Import Core modules in the AppModule only.`; 4 | throw new Error(msg); 5 | } 6 | } 7 | -------------------------------------------------------------------------------- /labs/standalone/begin/src/app/core/module-import-check.ts: -------------------------------------------------------------------------------- 1 | export function throwIfAlreadyLoaded(parentModule: any, moduleName: string) { 2 | if (parentModule) { 3 | const msg = `${moduleName} has already been loaded. Import Core modules in the AppModule only.`; 4 | throw new Error(msg); 5 | } 6 | } 7 | -------------------------------------------------------------------------------- /labs/standalone/begin/src/app/heroes/hero-detail/hero-detail.component.scss: -------------------------------------------------------------------------------- 1 | @import '../../../styles/mixin'; 2 | 3 | .mat-card { 4 | @include mat-card-layout; 5 | @include editarea-margins; 6 | } 7 | -------------------------------------------------------------------------------- /labs/standalone/begin/src/app/heroes/hero-list/hero-list.component.scss: -------------------------------------------------------------------------------- 1 | @import '../../../styles/mixin'; 2 | 3 | .heroes { 4 | @include item-list; 5 | } 6 | 7 | .mat-card { 8 | @include mat-card-layout; 9 | } 10 | -------------------------------------------------------------------------------- /labs/standalone/begin/src/app/heroes/heroes/heroes.component.scss: -------------------------------------------------------------------------------- 1 | @import '../../../styles/mixin'; 2 | 3 | .control-panel { 4 | @include control-panel-layout; 5 | } 6 | .content-container { 7 | @include content-container-layout; 8 | } 9 | -------------------------------------------------------------------------------- /labs/standalone/begin/src/app/heroes/routes.ts: -------------------------------------------------------------------------------- 1 | /*** DELETE THIS FILE ***/ 2 | 3 | import { Routes } from '@angular/router'; 4 | 5 | import { HeroesComponent } from './heroes/heroes.component'; 6 | 7 | export const routes: Routes = [ 8 | { path: '', pathMatch: 'full', component: HeroesComponent }, 9 | ]; 10 | -------------------------------------------------------------------------------- /labs/standalone/begin/src/app/villains/villain-detail/villain-detail.component.scss: -------------------------------------------------------------------------------- 1 | @import '../../../styles/mixin'; 2 | 3 | .mat-card { 4 | @include mat-card-layout; 5 | @include editarea-margins; 6 | } 7 | -------------------------------------------------------------------------------- /labs/standalone/begin/src/app/villains/villain-list/villain-list.component.scss: -------------------------------------------------------------------------------- 1 | @import '../../../styles/mixin'; 2 | 3 | .villains { 4 | @include item-list; 5 | } 6 | 7 | .mat-card { 8 | @include mat-card-layout; 9 | } 10 | -------------------------------------------------------------------------------- /labs/standalone/begin/src/app/villains/villains/villains.component.scss: -------------------------------------------------------------------------------- 1 | @import '../../../styles/mixin'; 2 | 3 | .control-panel { 4 | @include control-panel-layout; 5 | } 6 | .content-container { 7 | @include content-container-layout; 8 | } 9 | -------------------------------------------------------------------------------- /labs/standalone/begin/src/assets/.gitkeep: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/DanWahlin/angular-architecture/3075810e55f78dab9bc263849265af3763364ea7/labs/standalone/begin/src/assets/.gitkeep -------------------------------------------------------------------------------- /labs/standalone/begin/src/assets/jp-48.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/DanWahlin/angular-architecture/3075810e55f78dab9bc263849265af3763364ea7/labs/standalone/begin/src/assets/jp-48.jpg -------------------------------------------------------------------------------- /labs/standalone/begin/src/assets/jp.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/DanWahlin/angular-architecture/3075810e55f78dab9bc263849265af3763364ea7/labs/standalone/begin/src/assets/jp.jpg -------------------------------------------------------------------------------- /labs/standalone/begin/src/assets/ng.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/DanWahlin/angular-architecture/3075810e55f78dab9bc263849265af3763364ea7/labs/standalone/begin/src/assets/ng.png -------------------------------------------------------------------------------- /labs/standalone/begin/src/assets/wb-48.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/DanWahlin/angular-architecture/3075810e55f78dab9bc263849265af3763364ea7/labs/standalone/begin/src/assets/wb-48.jpg -------------------------------------------------------------------------------- /labs/standalone/begin/src/assets/wb.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/DanWahlin/angular-architecture/3075810e55f78dab9bc263849265af3763364ea7/labs/standalone/begin/src/assets/wb.jpg -------------------------------------------------------------------------------- /labs/standalone/begin/src/environments/environment.prod.ts: -------------------------------------------------------------------------------- 1 | export const environment = { 2 | production: true 3 | }; 4 | -------------------------------------------------------------------------------- /labs/standalone/begin/src/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/DanWahlin/angular-architecture/3075810e55f78dab9bc263849265af3763364ea7/labs/standalone/begin/src/favicon.ico -------------------------------------------------------------------------------- /labs/standalone/begin/src/styles.css: -------------------------------------------------------------------------------- 1 | /* You can add global styles to this file, and also import other style files */ 2 | -------------------------------------------------------------------------------- /labs/standalone/begin/src/styles/styles.scss: -------------------------------------------------------------------------------- 1 | @import 'mixin'; 2 | 3 | * { 4 | font-family: Arial; 5 | } 6 | h2 { 7 | color: #444; 8 | font-weight: lighter; 9 | } 10 | html, 11 | body { 12 | margin: 0px; 13 | font-family: Arial; 14 | } 15 | 16 | .button-panel > button { 17 | margin-right: 12px; 18 | } 19 | -------------------------------------------------------------------------------- /labs/standalone/begin/src/tsconfig.app.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../tsconfig.json", 3 | "compilerOptions": { 4 | "outDir": "../out-tsc/app", 5 | "types": [] 6 | }, 7 | "files": [ 8 | "main.ts", 9 | "polyfills.ts" 10 | ], 11 | "include": [ 12 | "src/**/*.d.ts" 13 | ] 14 | } 15 | -------------------------------------------------------------------------------- /labs/standalone/begin/src/tsconfig.spec.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../tsconfig.json", 3 | "compilerOptions": { 4 | "outDir": "../out-tsc/spec", 5 | "types": [ 6 | "jasmine", 7 | "node" 8 | ] 9 | }, 10 | "files": [ 11 | "test.ts", 12 | "polyfills.ts" 13 | ], 14 | "include": [ 15 | "**/*.spec.ts", 16 | "**/*.d.ts" 17 | ] 18 | } 19 | -------------------------------------------------------------------------------- /labs/standalone/begin/src/tslint.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../tslint.json", 3 | "rules": { 4 | "directive-selector": [ 5 | true, 6 | "attribute", 7 | "app", 8 | "camelCase" 9 | ], 10 | "component-selector": [ 11 | true, 12 | "element", 13 | "app", 14 | "kebab-case" 15 | ] 16 | } 17 | } 18 | -------------------------------------------------------------------------------- /labs/standalone/end/.browserslistrc: -------------------------------------------------------------------------------- 1 | # This file is currently used by autoprefixer to adjust CSS to support the below specified browsers 2 | # For additional information regarding the format and rule options, please see: 3 | # https://github.com/browserslist/browserslist#queries 4 | # For IE 9-11 support, please uncomment the last line of the file and adjust as needed 5 | > 0.5% 6 | last 2 versions 7 | Firefox ESR 8 | not dead 9 | # IE 9-11 -------------------------------------------------------------------------------- /labs/standalone/end/.editorconfig: -------------------------------------------------------------------------------- 1 | # Editor configuration, see http://editorconfig.org 2 | root = true 3 | 4 | [*] 5 | charset = utf-8 6 | indent_style = space 7 | indent_size = 2 8 | insert_final_newline = true 9 | trim_trailing_whitespace = true 10 | 11 | [*.md] 12 | max_line_length = off 13 | trim_trailing_whitespace = false 14 | -------------------------------------------------------------------------------- /labs/standalone/end/.prettierrc: -------------------------------------------------------------------------------- 1 | { 2 | "tabWidth": 2, 3 | "useTabs": false, 4 | "singleQuote": true 5 | } 6 | -------------------------------------------------------------------------------- /labs/standalone/end/src/README.md: -------------------------------------------------------------------------------- 1 | # Standalone Lab Reference 2 | 3 | The end state of the Standalone lab, after conversion from NgModule-based REFERENCE version. 4 | 5 | The REFERENCE version is the 100% NgModule state of the app, before any changes. It's a near perfect copy of the "routing-guards-and-preload-strategies" END state. 6 | -------------------------------------------------------------------------------- /labs/standalone/end/src/app/app.component.scss: -------------------------------------------------------------------------------- 1 | .layout { 2 | margin: 0px; 3 | // flex-flow: column wrap; 4 | display: flex; 5 | min-height: 100vh; 6 | flex-direction: column; 7 | } 8 | .content { 9 | flex: 1; 10 | margin: 0.5em; 11 | } 12 | -------------------------------------------------------------------------------- /labs/standalone/end/src/app/core/auth.guard.ts: -------------------------------------------------------------------------------- 1 | export const authGuard = () => { 2 | return true; 3 | }; 4 | -------------------------------------------------------------------------------- /labs/standalone/end/src/app/core/index.ts: -------------------------------------------------------------------------------- 1 | export * from "./in-memory-data.service"; 2 | export * from "./model"; 3 | export * from "./toast.service"; 4 | export * from "./network-aware-preload-strategy"; 5 | export * from "./opt-in-preload-strategy"; 6 | -------------------------------------------------------------------------------- /labs/standalone/end/src/app/core/model/hero.ts: -------------------------------------------------------------------------------- 1 | export class Hero { 2 | id: number; 3 | name: string; 4 | saying: string; 5 | } 6 | -------------------------------------------------------------------------------- /labs/standalone/end/src/app/core/model/index.ts: -------------------------------------------------------------------------------- 1 | export * from './hero'; 2 | export * from './villain'; 3 | -------------------------------------------------------------------------------- /labs/standalone/end/src/app/core/model/villain.ts: -------------------------------------------------------------------------------- 1 | export class Villain { 2 | id: number; 3 | name: string; 4 | saying: string; 5 | } 6 | -------------------------------------------------------------------------------- /labs/standalone/end/src/app/heroes/hero-detail/hero-detail.component.scss: -------------------------------------------------------------------------------- 1 | @import '../../../styles/mixin'; 2 | 3 | .mat-card { 4 | @include mat-card-layout; 5 | @include editarea-margins; 6 | } 7 | -------------------------------------------------------------------------------- /labs/standalone/end/src/app/heroes/hero-list/hero-list.component.scss: -------------------------------------------------------------------------------- 1 | @import '../../../styles/mixin'; 2 | 3 | .heroes { 4 | @include item-list; 5 | } 6 | 7 | .mat-card { 8 | @include mat-card-layout; 9 | } 10 | -------------------------------------------------------------------------------- /labs/standalone/end/src/app/heroes/heroes/heroes.component.scss: -------------------------------------------------------------------------------- 1 | @import '../../../styles/mixin'; 2 | 3 | .control-panel { 4 | @include control-panel-layout; 5 | } 6 | .content-container { 7 | @include content-container-layout; 8 | } 9 | -------------------------------------------------------------------------------- /labs/standalone/end/src/app/villains/villain-detail/villain-detail.component.scss: -------------------------------------------------------------------------------- 1 | @import '../../../styles/mixin'; 2 | 3 | .mat-card { 4 | @include mat-card-layout; 5 | @include editarea-margins; 6 | } 7 | -------------------------------------------------------------------------------- /labs/standalone/end/src/app/villains/villain-list/villain-list.component.scss: -------------------------------------------------------------------------------- 1 | @import '../../../styles/mixin'; 2 | 3 | .villains { 4 | @include item-list; 5 | } 6 | 7 | .mat-card { 8 | @include mat-card-layout; 9 | } 10 | -------------------------------------------------------------------------------- /labs/standalone/end/src/app/villains/villains/villains.component.scss: -------------------------------------------------------------------------------- 1 | @import '../../../styles/mixin'; 2 | 3 | .control-panel { 4 | @include control-panel-layout; 5 | } 6 | .content-container { 7 | @include content-container-layout; 8 | } 9 | -------------------------------------------------------------------------------- /labs/standalone/end/src/assets/.gitkeep: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/DanWahlin/angular-architecture/3075810e55f78dab9bc263849265af3763364ea7/labs/standalone/end/src/assets/.gitkeep -------------------------------------------------------------------------------- /labs/standalone/end/src/assets/jp-48.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/DanWahlin/angular-architecture/3075810e55f78dab9bc263849265af3763364ea7/labs/standalone/end/src/assets/jp-48.jpg -------------------------------------------------------------------------------- /labs/standalone/end/src/assets/jp.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/DanWahlin/angular-architecture/3075810e55f78dab9bc263849265af3763364ea7/labs/standalone/end/src/assets/jp.jpg -------------------------------------------------------------------------------- /labs/standalone/end/src/assets/ng.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/DanWahlin/angular-architecture/3075810e55f78dab9bc263849265af3763364ea7/labs/standalone/end/src/assets/ng.png -------------------------------------------------------------------------------- /labs/standalone/end/src/assets/wb-48.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/DanWahlin/angular-architecture/3075810e55f78dab9bc263849265af3763364ea7/labs/standalone/end/src/assets/wb-48.jpg -------------------------------------------------------------------------------- /labs/standalone/end/src/assets/wb.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/DanWahlin/angular-architecture/3075810e55f78dab9bc263849265af3763364ea7/labs/standalone/end/src/assets/wb.jpg -------------------------------------------------------------------------------- /labs/standalone/end/src/environments/environment.prod.ts: -------------------------------------------------------------------------------- 1 | export const environment = { 2 | production: true 3 | }; 4 | -------------------------------------------------------------------------------- /labs/standalone/end/src/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/DanWahlin/angular-architecture/3075810e55f78dab9bc263849265af3763364ea7/labs/standalone/end/src/favicon.ico -------------------------------------------------------------------------------- /labs/standalone/end/src/styles.css: -------------------------------------------------------------------------------- 1 | /* You can add global styles to this file, and also import other style files */ 2 | -------------------------------------------------------------------------------- /labs/standalone/end/src/styles/styles.scss: -------------------------------------------------------------------------------- 1 | @import 'mixin'; 2 | 3 | * { 4 | font-family: Arial; 5 | } 6 | h2 { 7 | color: #444; 8 | font-weight: lighter; 9 | } 10 | html, 11 | body { 12 | margin: 0px; 13 | font-family: Arial; 14 | } 15 | 16 | .button-panel > button { 17 | margin-right: 12px; 18 | } 19 | -------------------------------------------------------------------------------- /labs/standalone/end/src/tsconfig.app.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../tsconfig.json", 3 | "compilerOptions": { 4 | "outDir": "../out-tsc/app", 5 | "types": [] 6 | }, 7 | "files": [ 8 | "main.ts", 9 | "polyfills.ts" 10 | ], 11 | "include": [ 12 | "src/**/*.d.ts" 13 | ] 14 | } 15 | -------------------------------------------------------------------------------- /labs/standalone/end/src/tsconfig.spec.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../tsconfig.json", 3 | "compilerOptions": { 4 | "outDir": "../out-tsc/spec", 5 | "types": [ 6 | "jasmine", 7 | "node" 8 | ] 9 | }, 10 | "files": [ 11 | "test.ts", 12 | "polyfills.ts" 13 | ], 14 | "include": [ 15 | "**/*.spec.ts", 16 | "**/*.d.ts" 17 | ] 18 | } 19 | -------------------------------------------------------------------------------- /labs/standalone/end/src/tslint.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../tslint.json", 3 | "rules": { 4 | "directive-selector": [ 5 | true, 6 | "attribute", 7 | "app", 8 | "camelCase" 9 | ], 10 | "component-selector": [ 11 | true, 12 | "element", 13 | "app", 14 | "kebab-case" 15 | ] 16 | } 17 | } 18 | -------------------------------------------------------------------------------- /labs/standalone/reference/.browserslistrc: -------------------------------------------------------------------------------- 1 | # This file is currently used by autoprefixer to adjust CSS to support the below specified browsers 2 | # For additional information regarding the format and rule options, please see: 3 | # https://github.com/browserslist/browserslist#queries 4 | # For IE 9-11 support, please uncomment the last line of the file and adjust as needed 5 | > 0.5% 6 | last 2 versions 7 | Firefox ESR 8 | not dead 9 | # IE 9-11 -------------------------------------------------------------------------------- /labs/standalone/reference/.editorconfig: -------------------------------------------------------------------------------- 1 | # Editor configuration, see http://editorconfig.org 2 | root = true 3 | 4 | [*] 5 | charset = utf-8 6 | indent_style = space 7 | indent_size = 2 8 | insert_final_newline = true 9 | trim_trailing_whitespace = true 10 | 11 | [*.md] 12 | max_line_length = off 13 | trim_trailing_whitespace = false 14 | -------------------------------------------------------------------------------- /labs/standalone/reference/.prettierrc: -------------------------------------------------------------------------------- 1 | { 2 | "tabWidth": 2, 3 | "useTabs": false, 4 | "singleQuote": true 5 | } 6 | -------------------------------------------------------------------------------- /labs/standalone/reference/src/app/app.component.scss: -------------------------------------------------------------------------------- 1 | .layout { 2 | margin: 0px; 3 | // flex-flow: column wrap; 4 | display: flex; 5 | min-height: 100vh; 6 | flex-direction: column; 7 | } 8 | .content { 9 | flex: 1; 10 | margin: 0.5em; 11 | } 12 | -------------------------------------------------------------------------------- /labs/standalone/reference/src/app/app.component.ts: -------------------------------------------------------------------------------- 1 | import { Component } from '@angular/core'; 2 | 3 | @Component({ 4 | selector: 'app-root', 5 | template: ` 6 |
7 | 8 |
9 | 10 |
11 |
12 | `, 13 | styleUrls: ['./app.component.scss'] 14 | }) 15 | export class AppComponent {} 16 | -------------------------------------------------------------------------------- /labs/standalone/reference/src/app/core/auth.guard.ts: -------------------------------------------------------------------------------- 1 | export const authGuard = () => { 2 | return true; 3 | }; 4 | -------------------------------------------------------------------------------- /labs/standalone/reference/src/app/core/index.ts: -------------------------------------------------------------------------------- 1 | export * from "./core.module"; 2 | export * from "./in-memory-data.service"; 3 | export * from "./model"; 4 | export * from "./network-aware-preload-strategy"; 5 | export * from "./opt-in-preload-strategy"; 6 | export * from "./toast.service"; 7 | -------------------------------------------------------------------------------- /labs/standalone/reference/src/app/core/model/hero.ts: -------------------------------------------------------------------------------- 1 | export class Hero { 2 | id: number; 3 | name: string; 4 | saying: string; 5 | } 6 | -------------------------------------------------------------------------------- /labs/standalone/reference/src/app/core/model/index.ts: -------------------------------------------------------------------------------- 1 | export * from './hero'; 2 | export * from './villain'; 3 | -------------------------------------------------------------------------------- /labs/standalone/reference/src/app/core/model/villain.ts: -------------------------------------------------------------------------------- 1 | export class Villain { 2 | id: number; 3 | name: string; 4 | saying: string; 5 | } 6 | -------------------------------------------------------------------------------- /labs/standalone/reference/src/app/core/module-import-check.ts: -------------------------------------------------------------------------------- 1 | export function throwIfAlreadyLoaded(parentModule: any, moduleName: string) { 2 | if (parentModule) { 3 | const msg = `${moduleName} has already been loaded. Import Core modules in the AppModule only.`; 4 | throw new Error(msg); 5 | } 6 | } 7 | -------------------------------------------------------------------------------- /labs/standalone/reference/src/app/core/toolbar/toolbar.component.ts: -------------------------------------------------------------------------------- 1 | import { Component } from '@angular/core'; 2 | 3 | @Component({ 4 | selector: 'app-toolbar', 5 | templateUrl: './toolbar.component.html', 6 | styleUrls: ['./toolbar.component.scss'] 7 | }) 8 | export class ToolbarComponent { 9 | labTitle = 'Standalone'; 10 | labState = 'Reference'; 11 | } 12 | -------------------------------------------------------------------------------- /labs/standalone/reference/src/app/heroes/hero-detail/hero-detail.component.scss: -------------------------------------------------------------------------------- 1 | @import '../../../styles/mixin'; 2 | 3 | .mat-card { 4 | @include mat-card-layout; 5 | @include editarea-margins; 6 | } 7 | -------------------------------------------------------------------------------- /labs/standalone/reference/src/app/heroes/hero-list/hero-list.component.scss: -------------------------------------------------------------------------------- 1 | @import '../../../styles/mixin'; 2 | 3 | .heroes { 4 | @include item-list; 5 | } 6 | 7 | .mat-card { 8 | @include mat-card-layout; 9 | } 10 | -------------------------------------------------------------------------------- /labs/standalone/reference/src/app/heroes/heroes/heroes.component.scss: -------------------------------------------------------------------------------- 1 | @import '../../../styles/mixin'; 2 | 3 | .control-panel { 4 | @include control-panel-layout; 5 | } 6 | .content-container { 7 | @include content-container-layout; 8 | } 9 | -------------------------------------------------------------------------------- /labs/standalone/reference/src/app/heroes/routes.ts: -------------------------------------------------------------------------------- 1 | import { Routes } from '@angular/router'; 2 | 3 | import { HeroesComponent } from './heroes/heroes.component'; 4 | 5 | export const routes: Routes = [ 6 | { path: '', pathMatch: 'full', component: HeroesComponent }, 7 | ]; 8 | -------------------------------------------------------------------------------- /labs/standalone/reference/src/app/villains/routes.ts: -------------------------------------------------------------------------------- 1 | import { Routes } from '@angular/router'; 2 | 3 | import { VillainsComponent } from './villains/villains.component'; 4 | 5 | export const routes: Routes = [ 6 | { path: '', pathMatch: 'full', component: VillainsComponent }, 7 | ]; 8 | -------------------------------------------------------------------------------- /labs/standalone/reference/src/app/villains/villain-detail/villain-detail.component.scss: -------------------------------------------------------------------------------- 1 | @import '../../../styles/mixin'; 2 | 3 | .mat-card { 4 | @include mat-card-layout; 5 | @include editarea-margins; 6 | } 7 | -------------------------------------------------------------------------------- /labs/standalone/reference/src/app/villains/villain-list/villain-list.component.scss: -------------------------------------------------------------------------------- 1 | @import '../../../styles/mixin'; 2 | 3 | .villains { 4 | @include item-list; 5 | } 6 | 7 | .mat-card { 8 | @include mat-card-layout; 9 | } 10 | -------------------------------------------------------------------------------- /labs/standalone/reference/src/app/villains/villains/villains.component.scss: -------------------------------------------------------------------------------- 1 | @import '../../../styles/mixin'; 2 | 3 | .control-panel { 4 | @include control-panel-layout; 5 | } 6 | .content-container { 7 | @include content-container-layout; 8 | } 9 | -------------------------------------------------------------------------------- /labs/standalone/reference/src/assets/.gitkeep: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/DanWahlin/angular-architecture/3075810e55f78dab9bc263849265af3763364ea7/labs/standalone/reference/src/assets/.gitkeep -------------------------------------------------------------------------------- /labs/standalone/reference/src/assets/jp-48.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/DanWahlin/angular-architecture/3075810e55f78dab9bc263849265af3763364ea7/labs/standalone/reference/src/assets/jp-48.jpg -------------------------------------------------------------------------------- /labs/standalone/reference/src/assets/jp.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/DanWahlin/angular-architecture/3075810e55f78dab9bc263849265af3763364ea7/labs/standalone/reference/src/assets/jp.jpg -------------------------------------------------------------------------------- /labs/standalone/reference/src/assets/ng.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/DanWahlin/angular-architecture/3075810e55f78dab9bc263849265af3763364ea7/labs/standalone/reference/src/assets/ng.png -------------------------------------------------------------------------------- /labs/standalone/reference/src/assets/wb-48.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/DanWahlin/angular-architecture/3075810e55f78dab9bc263849265af3763364ea7/labs/standalone/reference/src/assets/wb-48.jpg -------------------------------------------------------------------------------- /labs/standalone/reference/src/assets/wb.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/DanWahlin/angular-architecture/3075810e55f78dab9bc263849265af3763364ea7/labs/standalone/reference/src/assets/wb.jpg -------------------------------------------------------------------------------- /labs/standalone/reference/src/environments/environment.prod.ts: -------------------------------------------------------------------------------- 1 | export const environment = { 2 | production: true 3 | }; 4 | -------------------------------------------------------------------------------- /labs/standalone/reference/src/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/DanWahlin/angular-architecture/3075810e55f78dab9bc263849265af3763364ea7/labs/standalone/reference/src/favicon.ico -------------------------------------------------------------------------------- /labs/standalone/reference/src/styles.css: -------------------------------------------------------------------------------- 1 | /* You can add global styles to this file, and also import other style files */ 2 | -------------------------------------------------------------------------------- /labs/standalone/reference/src/styles/styles.scss: -------------------------------------------------------------------------------- 1 | @import 'mixin'; 2 | 3 | * { 4 | font-family: Arial; 5 | } 6 | h2 { 7 | color: #444; 8 | font-weight: lighter; 9 | } 10 | html, 11 | body { 12 | margin: 0px; 13 | font-family: Arial; 14 | } 15 | 16 | .button-panel > button { 17 | margin-right: 12px; 18 | } 19 | -------------------------------------------------------------------------------- /labs/standalone/reference/src/tsconfig.app.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../tsconfig.json", 3 | "compilerOptions": { 4 | "outDir": "../out-tsc/app", 5 | "types": [] 6 | }, 7 | "files": [ 8 | "main.ts", 9 | "polyfills.ts" 10 | ], 11 | "include": [ 12 | "src/**/*.d.ts" 13 | ] 14 | } 15 | -------------------------------------------------------------------------------- /labs/standalone/reference/src/tsconfig.spec.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../tsconfig.json", 3 | "compilerOptions": { 4 | "outDir": "../out-tsc/spec", 5 | "types": [ 6 | "jasmine", 7 | "node" 8 | ] 9 | }, 10 | "files": [ 11 | "test.ts", 12 | "polyfills.ts" 13 | ], 14 | "include": [ 15 | "**/*.spec.ts", 16 | "**/*.d.ts" 17 | ] 18 | } 19 | -------------------------------------------------------------------------------- /labs/standalone/reference/src/tslint.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../tslint.json", 3 | "rules": { 4 | "directive-selector": [ 5 | true, 6 | "attribute", 7 | "app", 8 | "camelCase" 9 | ], 10 | "component-selector": [ 11 | true, 12 | "element", 13 | "app", 14 | "kebab-case" 15 | ] 16 | } 17 | } 18 | -------------------------------------------------------------------------------- /labs/state-management/ngrx-data/begin/.editorconfig: -------------------------------------------------------------------------------- 1 | # Editor configuration, see http://editorconfig.org 2 | root = true 3 | 4 | [*] 5 | charset = utf-8 6 | indent_style = space 7 | indent_size = 2 8 | insert_final_newline = true 9 | trim_trailing_whitespace = true 10 | 11 | [*.md] 12 | max_line_length = off 13 | trim_trailing_whitespace = false 14 | -------------------------------------------------------------------------------- /labs/state-management/ngrx-data/begin/.prettierrc: -------------------------------------------------------------------------------- 1 | { 2 | "tabWidth": 2, 3 | "useTabs": false, 4 | "singleQuote": true 5 | } 6 | -------------------------------------------------------------------------------- /labs/state-management/ngrx-data/begin/README.md: -------------------------------------------------------------------------------- 1 | # ngrx-data Demo 2 | 3 | Demo showing NgRx with Angular 4 | -------------------------------------------------------------------------------- /labs/state-management/ngrx-data/begin/e2e/app.e2e-spec.ts: -------------------------------------------------------------------------------- 1 | import { AppPage } from './app.po'; 2 | 3 | describe('angular-jumpstart App', () => { 4 | let page: AppPage; 5 | 6 | beforeEach(() => { 7 | page = new AppPage(); 8 | }); 9 | 10 | it('should display welcome message', () => { 11 | page.navigateTo(); 12 | expect(page.getParagraphText()).toEqual('Welcome to cm!'); 13 | }); 14 | }); 15 | -------------------------------------------------------------------------------- /labs/state-management/ngrx-data/begin/e2e/app.po.ts: -------------------------------------------------------------------------------- 1 | import { browser, by, element } from 'protractor'; 2 | 3 | export class AppPage { 4 | navigateTo() { 5 | return browser.get('/'); 6 | } 7 | 8 | getParagraphText() { 9 | return element(by.css('cm-root h1')).getText(); 10 | } 11 | } 12 | -------------------------------------------------------------------------------- /labs/state-management/ngrx-data/begin/e2e/tsconfig.e2e.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../tsconfig.json", 3 | "compilerOptions": { 4 | "outDir": "../out-tsc/e2e", 5 | "baseUrl": "./", 6 | "module": "commonjs", 7 | "target": "es5", 8 | "types": [ 9 | "jasmine", 10 | "jasminewd2", 11 | "node" 12 | ] 13 | } 14 | } 15 | -------------------------------------------------------------------------------- /labs/state-management/ngrx-data/begin/src/app/app.component.html: -------------------------------------------------------------------------------- 1 |
2 | 3 |
4 | -------------------------------------------------------------------------------- /labs/state-management/ngrx-data/begin/src/app/app.component.scss: -------------------------------------------------------------------------------- 1 | .title { 2 | margin-right: 1em; 3 | } 4 | -------------------------------------------------------------------------------- /labs/state-management/ngrx-data/begin/src/app/app.component.ts: -------------------------------------------------------------------------------- 1 | import { Component } from '@angular/core'; 2 | 3 | @Component({ 4 | selector: 'app-root', 5 | templateUrl: './app.component.html', 6 | styleUrls: ['./app.component.scss'] 7 | }) 8 | export class AppComponent {} 9 | -------------------------------------------------------------------------------- /labs/state-management/ngrx-data/begin/src/app/core/model/customer.ts: -------------------------------------------------------------------------------- 1 | export class Customer { 2 | id: number; 3 | name: string; 4 | city: string; 5 | orderTotal: number; 6 | } 7 | -------------------------------------------------------------------------------- /labs/state-management/ngrx-data/begin/src/app/core/model/order.ts: -------------------------------------------------------------------------------- 1 | export class Order { 2 | id: number; 3 | customerId: number; 4 | orderItems: OrderItem[]; 5 | } 6 | 7 | export class OrderItem { 8 | id: number; 9 | productName: string; 10 | itemCost: number; 11 | } 12 | -------------------------------------------------------------------------------- /labs/state-management/ngrx-data/begin/src/app/customers/customers-edit/customers-edit.component.scss: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/DanWahlin/angular-architecture/3075810e55f78dab9bc263849265af3763364ea7/labs/state-management/ngrx-data/begin/src/app/customers/customers-edit/customers-edit.component.scss -------------------------------------------------------------------------------- /labs/state-management/ngrx-data/begin/src/app/customers/customers.component.html: -------------------------------------------------------------------------------- 1 |

{{ title }}

2 |
3 | @if(customers$ | async; as customers) { 4 |
5 | 6 |
7 | } 8 | -------------------------------------------------------------------------------- /labs/state-management/ngrx-data/begin/src/app/customers/routes.ts: -------------------------------------------------------------------------------- 1 | import { Routes } from '@angular/router'; 2 | 3 | import { CustomersComponent } from './customers.component'; 4 | import { CustomersEditComponent } from './customers-edit/customers-edit.component'; 5 | 6 | export const routes: Routes = [ 7 | { path: '', component: CustomersComponent }, 8 | { path: ':id', component: CustomersEditComponent }, 9 | ]; 10 | -------------------------------------------------------------------------------- /labs/state-management/ngrx-data/begin/src/app/orders/orders.component.scss: -------------------------------------------------------------------------------- 1 | .orders-table { 2 | margin-top: 20px; 3 | } -------------------------------------------------------------------------------- /labs/state-management/ngrx-data/begin/src/app/orders/routes.ts: -------------------------------------------------------------------------------- 1 | import { Routes } from '@angular/router'; 2 | 3 | import { OrdersComponent } from './orders.component'; 4 | 5 | export const routes: Routes = [{ path: '', component: OrdersComponent }]; 6 | -------------------------------------------------------------------------------- /labs/state-management/ngrx-data/begin/src/app/shared/capitalize.pipe.ts: -------------------------------------------------------------------------------- 1 | import { Pipe, PipeTransform } from '@angular/core'; 2 | 3 | @Pipe({ name: 'capitalize' }) 4 | export class CapitalizePipe implements PipeTransform { 5 | transform(value: any) { 6 | if (value) { 7 | return value.charAt(0).toUpperCase() + value.slice(1); 8 | } 9 | return value; 10 | } 11 | } 12 | -------------------------------------------------------------------------------- /labs/state-management/ngrx-data/begin/src/app/store/entity-metadata.ts: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/DanWahlin/angular-architecture/3075810e55f78dab9bc263849265af3763364ea7/labs/state-management/ngrx-data/begin/src/app/store/entity-metadata.ts -------------------------------------------------------------------------------- /labs/state-management/ngrx-data/begin/src/environments/environment.prod.ts: -------------------------------------------------------------------------------- 1 | export const environment = { 2 | production: true, 3 | apiUrlBase: '/api' 4 | }; 5 | -------------------------------------------------------------------------------- /labs/state-management/ngrx-data/begin/src/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/DanWahlin/angular-architecture/3075810e55f78dab9bc263849265af3763364ea7/labs/state-management/ngrx-data/begin/src/favicon.ico -------------------------------------------------------------------------------- /labs/state-management/ngrx-data/begin/src/tsconfig.app.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../tsconfig.json", 3 | "compilerOptions": { 4 | "outDir": "../out-tsc/app", 5 | "baseUrl": "./", 6 | "types": [] 7 | }, 8 | "files": [ 9 | "main.ts", 10 | "polyfills.ts" 11 | ], 12 | "include": [ 13 | "src/**/*.d.ts" 14 | ] 15 | } 16 | -------------------------------------------------------------------------------- /labs/state-management/ngrx-data/begin/src/tsconfig.spec.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../tsconfig.json", 3 | "compilerOptions": { 4 | "outDir": "../out-tsc/spec", 5 | "baseUrl": "./", 6 | "types": ["jasmine", "node"] 7 | }, 8 | "files": ["test.ts", "polyfills.ts"], 9 | "include": ["**/*.spec.ts", "**/*.d.ts"] 10 | } 11 | -------------------------------------------------------------------------------- /labs/state-management/ngrx-data/begin/src/typings.d.ts: -------------------------------------------------------------------------------- 1 | /* SystemJS module definition */ 2 | declare var module: NodeModule; 3 | interface NodeModule { 4 | id: string; 5 | } 6 | -------------------------------------------------------------------------------- /labs/state-management/ngrx-data/end/.prettierrc: -------------------------------------------------------------------------------- 1 | { 2 | "tabWidth": 2, 3 | "useTabs": false, 4 | "singleQuote": true 5 | } 6 | -------------------------------------------------------------------------------- /labs/state-management/ngrx-data/end/readme.md: -------------------------------------------------------------------------------- 1 | ## See Angular-Architecture/state-management/ngrx-data for the solution code -------------------------------------------------------------------------------- /labs/state-management/ngrx/begin/.editorconfig: -------------------------------------------------------------------------------- 1 | # Editor configuration, see http://editorconfig.org 2 | root = true 3 | 4 | [*] 5 | charset = utf-8 6 | indent_style = space 7 | indent_size = 2 8 | insert_final_newline = true 9 | trim_trailing_whitespace = true 10 | 11 | [*.md] 12 | max_line_length = off 13 | trim_trailing_whitespace = false 14 | -------------------------------------------------------------------------------- /labs/state-management/ngrx/begin/.prettierrc: -------------------------------------------------------------------------------- 1 | { 2 | "tabWidth": 2, 3 | "useTabs": false, 4 | "singleQuote": true 5 | } 6 | -------------------------------------------------------------------------------- /labs/state-management/ngrx/begin/README.md: -------------------------------------------------------------------------------- 1 | # NgrxDemo 2 | 3 | Demo showing NgRx with Angular 4 | -------------------------------------------------------------------------------- /labs/state-management/ngrx/begin/e2e/app.e2e-spec.ts: -------------------------------------------------------------------------------- 1 | import { AppPage } from './app.po'; 2 | 3 | describe('angular-jumpstart App', () => { 4 | let page: AppPage; 5 | 6 | beforeEach(() => { 7 | page = new AppPage(); 8 | }); 9 | 10 | it('should display welcome message', () => { 11 | page.navigateTo(); 12 | expect(page.getParagraphText()).toEqual('Welcome to cm!'); 13 | }); 14 | }); 15 | -------------------------------------------------------------------------------- /labs/state-management/ngrx/begin/e2e/app.po.ts: -------------------------------------------------------------------------------- 1 | import { browser, by, element } from 'protractor'; 2 | 3 | export class AppPage { 4 | navigateTo() { 5 | return browser.get('/'); 6 | } 7 | 8 | getParagraphText() { 9 | return element(by.css('cm-root h1')).getText(); 10 | } 11 | } 12 | -------------------------------------------------------------------------------- /labs/state-management/ngrx/begin/e2e/tsconfig.e2e.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../tsconfig.json", 3 | "compilerOptions": { 4 | "outDir": "../out-tsc/e2e", 5 | "baseUrl": "./", 6 | "module": "commonjs", 7 | "target": "es5", 8 | "types": [ 9 | "jasmine", 10 | "jasminewd2", 11 | "node" 12 | ] 13 | } 14 | } 15 | -------------------------------------------------------------------------------- /labs/state-management/ngrx/begin/src/app/app.component.html: -------------------------------------------------------------------------------- 1 |
2 | 3 |
4 | -------------------------------------------------------------------------------- /labs/state-management/ngrx/begin/src/app/app.component.scss: -------------------------------------------------------------------------------- 1 | .title { 2 | margin-right: 1em; 3 | } 4 | -------------------------------------------------------------------------------- /labs/state-management/ngrx/begin/src/app/app.component.ts: -------------------------------------------------------------------------------- 1 | import { Component } from '@angular/core'; 2 | 3 | @Component({ 4 | selector: 'app-root', 5 | templateUrl: './app.component.html', 6 | styleUrls: ['./app.component.scss'] 7 | }) 8 | export class AppComponent {} 9 | -------------------------------------------------------------------------------- /labs/state-management/ngrx/begin/src/app/core/model/customer.ts: -------------------------------------------------------------------------------- 1 | export class Customer { 2 | id: number; 3 | name: string; 4 | city: string; 5 | orderTotal: number; 6 | } 7 | -------------------------------------------------------------------------------- /labs/state-management/ngrx/begin/src/app/core/model/order.ts: -------------------------------------------------------------------------------- 1 | export class Order { 2 | id: number; 3 | customerId: number; 4 | orderItems: OrderItem[]; 5 | } 6 | 7 | export class OrderItem { 8 | id: number; 9 | productName: string; 10 | itemCost: number; 11 | } 12 | -------------------------------------------------------------------------------- /labs/state-management/ngrx/begin/src/app/customers/customers-edit/customers-edit.component.scss: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/DanWahlin/angular-architecture/3075810e55f78dab9bc263849265af3763364ea7/labs/state-management/ngrx/begin/src/app/customers/customers-edit/customers-edit.component.scss -------------------------------------------------------------------------------- /labs/state-management/ngrx/begin/src/app/customers/customers.component.html: -------------------------------------------------------------------------------- 1 |

{{ title }}

2 |
3 | @if(customers$ | async; as customers) { 4 |
5 | 6 |
7 | } 8 | -------------------------------------------------------------------------------- /labs/state-management/ngrx/begin/src/app/customers/routes.ts: -------------------------------------------------------------------------------- 1 | import { Routes } from '@angular/router'; 2 | 3 | import { CustomersComponent } from './customers.component'; 4 | import { CustomersEditComponent } from './customers-edit/customers-edit.component'; 5 | 6 | export const routes: Routes = [ 7 | { path: '', component: CustomersComponent }, 8 | { path: ':id', component: CustomersEditComponent }, 9 | ]; 10 | -------------------------------------------------------------------------------- /labs/state-management/ngrx/begin/src/app/orders/orders.component.scss: -------------------------------------------------------------------------------- 1 | .orders-table { 2 | margin-top: 20px; 3 | } -------------------------------------------------------------------------------- /labs/state-management/ngrx/begin/src/app/orders/routes.ts: -------------------------------------------------------------------------------- 1 | import { Routes } from '@angular/router'; 2 | 3 | import { OrdersComponent } from '../orders/orders.component'; 4 | 5 | export const routes: Routes = [{ path: '', component: OrdersComponent }]; 6 | -------------------------------------------------------------------------------- /labs/state-management/ngrx/begin/src/app/shared/capitalize.pipe.ts: -------------------------------------------------------------------------------- 1 | import { Pipe, PipeTransform } from '@angular/core'; 2 | 3 | @Pipe({ name: 'capitalize' }) 4 | export class CapitalizePipe implements PipeTransform { 5 | transform(value: any) { 6 | if (value) { 7 | return value.charAt(0).toUpperCase() + value.slice(1); 8 | } 9 | return value; 10 | } 11 | } 12 | -------------------------------------------------------------------------------- /labs/state-management/ngrx/begin/src/app/store/actions/index.ts: -------------------------------------------------------------------------------- 1 | export * from './data.actions'; 2 | export * from './customer.actions'; 3 | export * from './order.actions'; 4 | -------------------------------------------------------------------------------- /labs/state-management/ngrx/begin/src/app/store/index.ts: -------------------------------------------------------------------------------- 1 | export * from './actions'; 2 | export * from './reducers'; 3 | export * from './services'; -------------------------------------------------------------------------------- /labs/state-management/ngrx/begin/src/app/store/services/data-error.service.ts: -------------------------------------------------------------------------------- 1 | export class DataServiceError { 2 | constructor(public error: any, public requestData: T) {} 3 | } 4 | -------------------------------------------------------------------------------- /labs/state-management/ngrx/begin/src/app/store/services/index.ts: -------------------------------------------------------------------------------- 1 | export { DataServiceError } from './data-error.service'; 2 | 3 | export * from './customer-data.service'; 4 | export * from './order-data.service'; 5 | 6 | export * from './customer.selectors'; 7 | export * from './order.selectors'; 8 | -------------------------------------------------------------------------------- /labs/state-management/ngrx/begin/src/environments/environment.prod.ts: -------------------------------------------------------------------------------- 1 | export const environment = { 2 | production: true, 3 | apiUrlBase: '/api' 4 | }; 5 | -------------------------------------------------------------------------------- /labs/state-management/ngrx/begin/src/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/DanWahlin/angular-architecture/3075810e55f78dab9bc263849265af3763364ea7/labs/state-management/ngrx/begin/src/favicon.ico -------------------------------------------------------------------------------- /labs/state-management/ngrx/begin/src/tsconfig.app.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../tsconfig.json", 3 | "compilerOptions": { 4 | "outDir": "../out-tsc/app", 5 | "baseUrl": "./", 6 | "types": [] 7 | }, 8 | "files": [ 9 | "main.ts", 10 | "polyfills.ts" 11 | ], 12 | "include": [ 13 | "src/**/*.d.ts" 14 | ] 15 | } 16 | -------------------------------------------------------------------------------- /labs/state-management/ngrx/begin/src/tsconfig.spec.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../tsconfig.json", 3 | "compilerOptions": { 4 | "outDir": "../out-tsc/spec", 5 | "baseUrl": "./", 6 | "types": ["jasmine", "node"] 7 | }, 8 | "files": ["test.ts", "polyfills.ts"], 9 | "include": ["**/*.spec.ts", "**/*.d.ts"] 10 | } 11 | -------------------------------------------------------------------------------- /labs/state-management/ngrx/begin/src/typings.d.ts: -------------------------------------------------------------------------------- 1 | /* SystemJS module definition */ 2 | declare var module: NodeModule; 3 | interface NodeModule { 4 | id: string; 5 | } 6 | -------------------------------------------------------------------------------- /labs/state-management/ngrx/end/.prettierrc: -------------------------------------------------------------------------------- 1 | { 2 | "tabWidth": 2, 3 | "useTabs": false, 4 | "singleQuote": true 5 | } 6 | -------------------------------------------------------------------------------- /labs/state-management/ngrx/end/readme.md: -------------------------------------------------------------------------------- 1 | ## See Angular-Architecture/state-management/ngrx for the solution code -------------------------------------------------------------------------------- /labs/state-management/observable-store/begin/.editorconfig: -------------------------------------------------------------------------------- 1 | # Editor configuration, see http://editorconfig.org 2 | root = true 3 | 4 | [*] 5 | charset = utf-8 6 | indent_style = space 7 | indent_size = 2 8 | insert_final_newline = true 9 | trim_trailing_whitespace = true 10 | 11 | [*.md] 12 | max_line_length = off 13 | trim_trailing_whitespace = false 14 | -------------------------------------------------------------------------------- /labs/state-management/observable-store/begin/.prettierrc: -------------------------------------------------------------------------------- 1 | { 2 | "tabWidth": 2, 3 | "useTabs": false, 4 | "singleQuote": true 5 | } 6 | -------------------------------------------------------------------------------- /labs/state-management/observable-store/begin/README.md: -------------------------------------------------------------------------------- 1 | # NgrxDemo 2 | 3 | Demo showing NgRx with Angular 4 | -------------------------------------------------------------------------------- /labs/state-management/observable-store/begin/src/app/app.component.html: -------------------------------------------------------------------------------- 1 |
2 | 3 |
4 | -------------------------------------------------------------------------------- /labs/state-management/observable-store/begin/src/app/app.component.scss: -------------------------------------------------------------------------------- 1 | .title { 2 | margin-right: 1em; 3 | } 4 | -------------------------------------------------------------------------------- /labs/state-management/observable-store/begin/src/app/app.component.ts: -------------------------------------------------------------------------------- 1 | import { Component } from '@angular/core'; 2 | 3 | @Component({ 4 | selector: 'app-root', 5 | templateUrl: './app.component.html', 6 | styleUrls: ['./app.component.scss'] 7 | }) 8 | export class AppComponent {} 9 | -------------------------------------------------------------------------------- /labs/state-management/observable-store/begin/src/app/core/model/customer.ts: -------------------------------------------------------------------------------- 1 | export interface Customer { 2 | id: number; 3 | name: string; 4 | city: string; 5 | orderTotal: number; 6 | } 7 | -------------------------------------------------------------------------------- /labs/state-management/observable-store/begin/src/app/core/model/index.ts: -------------------------------------------------------------------------------- 1 | export * from './customer'; 2 | export * from './order'; -------------------------------------------------------------------------------- /labs/state-management/observable-store/begin/src/app/core/model/order.ts: -------------------------------------------------------------------------------- 1 | export interface Order { 2 | id: number; 3 | customerId: number; 4 | orderItems: OrderItem[]; 5 | } 6 | 7 | export interface OrderItem { 8 | id: number; 9 | productName: string; 10 | itemCost: number; 11 | } 12 | -------------------------------------------------------------------------------- /labs/state-management/observable-store/begin/src/app/customers/customers-edit/customers-edit.component.scss: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/DanWahlin/angular-architecture/3075810e55f78dab9bc263849265af3763364ea7/labs/state-management/observable-store/begin/src/app/customers/customers-edit/customers-edit.component.scss -------------------------------------------------------------------------------- /labs/state-management/observable-store/begin/src/app/customers/customers.component.html: -------------------------------------------------------------------------------- 1 |

{{ title }}

2 |
3 | @if(customers$ | async; as customers) { 4 |
5 | 6 |
7 | } ``` 8 | -------------------------------------------------------------------------------- /labs/state-management/observable-store/begin/src/app/customers/routes.ts: -------------------------------------------------------------------------------- 1 | import { Routes } from '@angular/router'; 2 | 3 | import { CustomersComponent } from './customers.component'; 4 | import { CustomersEditComponent } from './customers-edit/customers-edit.component'; 5 | 6 | export const routes: Routes = [ 7 | { path: '', component: CustomersComponent }, 8 | { path: ':id', component: CustomersEditComponent }, 9 | ]; 10 | -------------------------------------------------------------------------------- /labs/state-management/observable-store/begin/src/app/orders/orders.component.scss: -------------------------------------------------------------------------------- 1 | .orders-table { 2 | margin-top: 20px; 3 | } -------------------------------------------------------------------------------- /labs/state-management/observable-store/begin/src/app/orders/routes.ts: -------------------------------------------------------------------------------- 1 | import { Routes } from '@angular/router'; 2 | 3 | import { OrdersComponent } from './orders.component'; 4 | 5 | export const routes: Routes = [{ path: '', component: OrdersComponent }]; 6 | -------------------------------------------------------------------------------- /labs/state-management/observable-store/begin/src/app/shared/capitalize.pipe.ts: -------------------------------------------------------------------------------- 1 | import { Pipe, PipeTransform } from '@angular/core'; 2 | 3 | @Pipe({ name: 'capitalize' }) 4 | export class CapitalizePipe implements PipeTransform { 5 | transform(value: any) { 6 | if (value) { 7 | return value.charAt(0).toUpperCase() + value.slice(1); 8 | } 9 | return value; 10 | } 11 | } 12 | -------------------------------------------------------------------------------- /labs/state-management/observable-store/begin/src/app/shared/interfaces.ts: -------------------------------------------------------------------------------- 1 | import { Customer, Order } from '../core/model'; 2 | 3 | export interface StoreState { 4 | customers: Customer[]; 5 | customer: Customer; 6 | orders: Order[]; 7 | } -------------------------------------------------------------------------------- /labs/state-management/observable-store/begin/src/environments/environment.prod.ts: -------------------------------------------------------------------------------- 1 | export const environment = { 2 | production: true, 3 | apiUrlBase: '/api' 4 | }; 5 | -------------------------------------------------------------------------------- /labs/state-management/observable-store/begin/src/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/DanWahlin/angular-architecture/3075810e55f78dab9bc263849265af3763364ea7/labs/state-management/observable-store/begin/src/favicon.ico -------------------------------------------------------------------------------- /labs/state-management/observable-store/begin/src/tsconfig.app.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../tsconfig.json", 3 | "compilerOptions": { 4 | "outDir": "../out-tsc/app", 5 | "baseUrl": "./", 6 | "types": [] 7 | }, 8 | "files": [ 9 | "main.ts", 10 | "polyfills.ts" 11 | ], 12 | "include": [ 13 | "src/**/*.d.ts" 14 | ] 15 | } 16 | -------------------------------------------------------------------------------- /labs/state-management/observable-store/begin/src/tsconfig.spec.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../tsconfig.json", 3 | "compilerOptions": { 4 | "outDir": "../out-tsc/spec", 5 | "baseUrl": "./", 6 | "types": ["jasmine", "node"] 7 | }, 8 | "files": ["test.ts", "polyfills.ts"], 9 | "include": ["**/*.spec.ts", "**/*.d.ts"] 10 | } 11 | -------------------------------------------------------------------------------- /labs/state-management/observable-store/begin/src/typings.d.ts: -------------------------------------------------------------------------------- 1 | /* SystemJS module definition */ 2 | declare var module: NodeModule; 3 | interface NodeModule { 4 | id: string; 5 | } 6 | -------------------------------------------------------------------------------- /labs/state-management/observable-store/end/.prettierrc: -------------------------------------------------------------------------------- 1 | { 2 | "tabWidth": 2, 3 | "useTabs": false, 4 | "singleQuote": true 5 | } 6 | -------------------------------------------------------------------------------- /labs/state-management/observable-store/end/readme.md: -------------------------------------------------------------------------------- 1 | ## See Angular-Architecture/state-management/observable-store for the solution code -------------------------------------------------------------------------------- /labs/view-models/begin/.editorconfig: -------------------------------------------------------------------------------- 1 | # Editor configuration, see https://editorconfig.org 2 | root = true 3 | 4 | [*] 5 | charset = utf-8 6 | indent_style = space 7 | indent_size = 2 8 | insert_final_newline = true 9 | trim_trailing_whitespace = true 10 | 11 | [*.md] 12 | max_line_length = off 13 | trim_trailing_whitespace = false 14 | -------------------------------------------------------------------------------- /labs/view-models/begin/.prettierrc: -------------------------------------------------------------------------------- 1 | { 2 | "tabWidth": 2, 3 | "useTabs": false, 4 | "singleQuote": true 5 | } 6 | -------------------------------------------------------------------------------- /labs/view-models/begin/src/app/animations/index.ts: -------------------------------------------------------------------------------- 1 | export * from './expand-collapse.animations'; 2 | export * from './fade.animations'; 3 | -------------------------------------------------------------------------------- /labs/view-models/begin/src/app/app.component.css: -------------------------------------------------------------------------------- 1 | .wrapper { 2 | margin: 20px; 3 | } 4 | 5 | .pointer { 6 | cursor: pointer; 7 | } 8 | 9 | ul { 10 | padding: 0; 11 | list-style-type: none; 12 | } 13 | 14 | ul li { 15 | display: inline; 16 | margin-right: 15px; 17 | font-weight: bold; 18 | } -------------------------------------------------------------------------------- /labs/view-models/begin/src/app/app.config.ts: -------------------------------------------------------------------------------- 1 | import {ApplicationConfig} from '@angular/core'; 2 | import {provideProtractorTestingSupport} from '@angular/platform-browser'; 3 | import { provideAnimations } from '@angular/platform-browser/animations' 4 | 5 | export const appConfig: ApplicationConfig = { 6 | providers: [ 7 | provideProtractorTestingSupport(), 8 | provideAnimations() 9 | ], 10 | }; 11 | -------------------------------------------------------------------------------- /labs/view-models/begin/src/app/model/index.ts: -------------------------------------------------------------------------------- 1 | export * from './customer'; 2 | export * from './line-item'; 3 | export * from './order'; 4 | export * from './product'; 5 | 6 | export * from './entity-cache'; 7 | export * from './entity-operations'; 8 | -------------------------------------------------------------------------------- /labs/view-models/begin/src/app/model/product.ts: -------------------------------------------------------------------------------- 1 | export class Product { 2 | id: number; 3 | productName: string; 4 | price: number; 5 | 6 | static create(id: number, product: Partial = {}) { 7 | const newProduct = Object.assign(new Product, { 8 | // Defaults 9 | productName: 'New Product ' + id, 10 | price: 0, 11 | ...product, 12 | id 13 | }); 14 | return newProduct; 15 | } 16 | } -------------------------------------------------------------------------------- /labs/view-models/begin/src/app/services/index.ts: -------------------------------------------------------------------------------- 1 | export * from './customer-orders-data.service'; 2 | export * from './order-graph'; -------------------------------------------------------------------------------- /labs/view-models/begin/src/app/shared/index.ts: -------------------------------------------------------------------------------- 1 | export { calcAge, AgePipe } from './age.pipe'; 2 | export { calcFullName, FullNamePipe } from './fullname.pipe'; 3 | export { InputDateComponent } from './input-date.component'; 4 | -------------------------------------------------------------------------------- /labs/view-models/begin/src/assets/.gitkeep: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/DanWahlin/angular-architecture/3075810e55f78dab9bc263849265af3763364ea7/labs/view-models/begin/src/assets/.gitkeep -------------------------------------------------------------------------------- /labs/view-models/begin/src/assets/fabio.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/DanWahlin/angular-architecture/3075810e55f78dab9bc263849265af3763364ea7/labs/view-models/begin/src/assets/fabio.jpg -------------------------------------------------------------------------------- /labs/view-models/begin/src/assets/klum.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/DanWahlin/angular-architecture/3075810e55f78dab9bc263849265af3763364ea7/labs/view-models/begin/src/assets/klum.jpg -------------------------------------------------------------------------------- /labs/view-models/begin/src/assets/lucy-liu.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/DanWahlin/angular-architecture/3075810e55f78dab9bc263849265af3763364ea7/labs/view-models/begin/src/assets/lucy-liu.png -------------------------------------------------------------------------------- /labs/view-models/begin/src/assets/missing-person.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/DanWahlin/angular-architecture/3075810e55f78dab9bc263849265af3763364ea7/labs/view-models/begin/src/assets/missing-person.png -------------------------------------------------------------------------------- /labs/view-models/begin/src/assets/tyson-beckford.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/DanWahlin/angular-architecture/3075810e55f78dab9bc263849265af3763364ea7/labs/view-models/begin/src/assets/tyson-beckford.png -------------------------------------------------------------------------------- /labs/view-models/begin/src/assets/zoolander.jpeg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/DanWahlin/angular-architecture/3075810e55f78dab9bc263849265af3763364ea7/labs/view-models/begin/src/assets/zoolander.jpeg -------------------------------------------------------------------------------- /labs/view-models/begin/src/environments/environment.prod.ts: -------------------------------------------------------------------------------- 1 | export const environment = { 2 | production: true 3 | }; 4 | -------------------------------------------------------------------------------- /labs/view-models/begin/src/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/DanWahlin/angular-architecture/3075810e55f78dab9bc263849265af3763364ea7/labs/view-models/begin/src/favicon.ico -------------------------------------------------------------------------------- /labs/view-models/begin/src/main.ts: -------------------------------------------------------------------------------- 1 | import {bootstrapApplication} from '@angular/platform-browser'; 2 | 3 | import {AppComponent} from './app/app.component'; 4 | import {appConfig} from './app/app.config'; 5 | 6 | bootstrapApplication(AppComponent, appConfig) 7 | .catch(err => console.error(err));; 8 | -------------------------------------------------------------------------------- /labs/view-models/begin/src/styles.css: -------------------------------------------------------------------------------- 1 | /* You can add global styles to this file, and also import other style files */ 2 | -------------------------------------------------------------------------------- /labs/view-models/begin/tsconfig.app.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "./tsconfig.json", 3 | "compilerOptions": { 4 | "outDir": "./out-tsc/app", 5 | "types": [] 6 | }, 7 | "files": [ 8 | "src/main.ts", 9 | "src/polyfills.ts" 10 | ], 11 | "include": [ 12 | "src/**/*.d.ts" 13 | ] 14 | } 15 | -------------------------------------------------------------------------------- /labs/view-models/begin/tsconfig.spec.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "./tsconfig.json", 3 | "compilerOptions": { 4 | "outDir": "./out-tsc/spec", 5 | "types": [ 6 | "jasmine", 7 | "node" 8 | ] 9 | }, 10 | "files": [ 11 | "src/test.ts", 12 | "src/polyfills.ts" 13 | ], 14 | "include": [ 15 | "src/**/*.spec.ts", 16 | "src/**/*.d.ts" 17 | ] 18 | } 19 | -------------------------------------------------------------------------------- /labs/view-models/end/.editorconfig: -------------------------------------------------------------------------------- 1 | # Editor configuration, see https://editorconfig.org 2 | root = true 3 | 4 | [*] 5 | charset = utf-8 6 | indent_style = space 7 | indent_size = 2 8 | insert_final_newline = true 9 | trim_trailing_whitespace = true 10 | 11 | [*.md] 12 | max_line_length = off 13 | trim_trailing_whitespace = false 14 | -------------------------------------------------------------------------------- /labs/view-models/end/.prettierrc: -------------------------------------------------------------------------------- 1 | { 2 | "tabWidth": 2, 3 | "useTabs": false, 4 | "singleQuote": true 5 | } 6 | -------------------------------------------------------------------------------- /labs/view-models/end/src/app/animations/index.ts: -------------------------------------------------------------------------------- 1 | export * from './expand-collapse.animations'; 2 | export * from './fade.animations'; 3 | -------------------------------------------------------------------------------- /labs/view-models/end/src/app/app.component.css: -------------------------------------------------------------------------------- 1 | .wrapper { 2 | margin: 20px; 3 | } 4 | 5 | .pointer { 6 | cursor: pointer; 7 | } 8 | 9 | ul { 10 | padding: 0; 11 | list-style-type: none; 12 | } 13 | 14 | ul li { 15 | display: inline; 16 | margin-right: 15px; 17 | font-weight: bold; 18 | } -------------------------------------------------------------------------------- /labs/view-models/end/src/app/app.config.ts: -------------------------------------------------------------------------------- 1 | import {ApplicationConfig} from '@angular/core'; 2 | import {provideProtractorTestingSupport} from '@angular/platform-browser'; 3 | import { provideAnimations } from '@angular/platform-browser/animations' 4 | 5 | export const appConfig: ApplicationConfig = { 6 | providers: [ 7 | provideProtractorTestingSupport(), 8 | provideAnimations() 9 | ], 10 | }; 11 | -------------------------------------------------------------------------------- /labs/view-models/end/src/app/model/index.ts: -------------------------------------------------------------------------------- 1 | export * from './customer'; 2 | export * from './line-item'; 3 | export * from './order'; 4 | export * from './product'; 5 | 6 | export * from './entity-cache'; 7 | export * from './entity-operations'; 8 | -------------------------------------------------------------------------------- /labs/view-models/end/src/app/model/product.ts: -------------------------------------------------------------------------------- 1 | export class Product { 2 | id: number; 3 | productName: string; 4 | price: number; 5 | 6 | static create(id: number, product: Partial = {}) { 7 | const newProduct = Object.assign(new Product, { 8 | // Defaults 9 | productName: 'New Product ' + id, 10 | price: 0, 11 | ...product, 12 | id 13 | }); 14 | return newProduct; 15 | } 16 | } -------------------------------------------------------------------------------- /labs/view-models/end/src/app/services/index.ts: -------------------------------------------------------------------------------- 1 | export * from './customer-orders-data.service'; 2 | export * from './order-graph'; -------------------------------------------------------------------------------- /labs/view-models/end/src/app/shared/index.ts: -------------------------------------------------------------------------------- 1 | export { calcAge, AgePipe } from './age.pipe'; 2 | export { calcFullName, FullNamePipe } from './fullname.pipe'; 3 | export { InputDateComponent } from './input-date.component'; 4 | -------------------------------------------------------------------------------- /labs/view-models/end/src/assets/.gitkeep: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/DanWahlin/angular-architecture/3075810e55f78dab9bc263849265af3763364ea7/labs/view-models/end/src/assets/.gitkeep -------------------------------------------------------------------------------- /labs/view-models/end/src/assets/fabio.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/DanWahlin/angular-architecture/3075810e55f78dab9bc263849265af3763364ea7/labs/view-models/end/src/assets/fabio.jpg -------------------------------------------------------------------------------- /labs/view-models/end/src/assets/klum.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/DanWahlin/angular-architecture/3075810e55f78dab9bc263849265af3763364ea7/labs/view-models/end/src/assets/klum.jpg -------------------------------------------------------------------------------- /labs/view-models/end/src/assets/lucy-liu.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/DanWahlin/angular-architecture/3075810e55f78dab9bc263849265af3763364ea7/labs/view-models/end/src/assets/lucy-liu.png -------------------------------------------------------------------------------- /labs/view-models/end/src/assets/missing-person.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/DanWahlin/angular-architecture/3075810e55f78dab9bc263849265af3763364ea7/labs/view-models/end/src/assets/missing-person.png -------------------------------------------------------------------------------- /labs/view-models/end/src/assets/tyson-beckford.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/DanWahlin/angular-architecture/3075810e55f78dab9bc263849265af3763364ea7/labs/view-models/end/src/assets/tyson-beckford.png -------------------------------------------------------------------------------- /labs/view-models/end/src/assets/zoolander.jpeg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/DanWahlin/angular-architecture/3075810e55f78dab9bc263849265af3763364ea7/labs/view-models/end/src/assets/zoolander.jpeg -------------------------------------------------------------------------------- /labs/view-models/end/src/environments/environment.prod.ts: -------------------------------------------------------------------------------- 1 | export const environment = { 2 | production: true 3 | }; 4 | -------------------------------------------------------------------------------- /labs/view-models/end/src/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/DanWahlin/angular-architecture/3075810e55f78dab9bc263849265af3763364ea7/labs/view-models/end/src/favicon.ico -------------------------------------------------------------------------------- /labs/view-models/end/src/main.ts: -------------------------------------------------------------------------------- 1 | import {bootstrapApplication} from '@angular/platform-browser'; 2 | 3 | import {AppComponent} from './app/app.component'; 4 | import {appConfig} from './app/app.config'; 5 | 6 | bootstrapApplication(AppComponent, appConfig) 7 | .catch(err => console.error(err));; 8 | -------------------------------------------------------------------------------- /labs/view-models/end/src/styles.css: -------------------------------------------------------------------------------- 1 | /* You can add global styles to this file, and also import other style files */ 2 | -------------------------------------------------------------------------------- /labs/view-models/end/tsconfig.app.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "./tsconfig.json", 3 | "compilerOptions": { 4 | "outDir": "./out-tsc/app", 5 | "types": [] 6 | }, 7 | "files": [ 8 | "src/main.ts", 9 | "src/polyfills.ts" 10 | ], 11 | "include": [ 12 | "src/**/*.d.ts" 13 | ] 14 | } 15 | -------------------------------------------------------------------------------- /labs/view-models/end/tsconfig.spec.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "./tsconfig.json", 3 | "compilerOptions": { 4 | "outDir": "./out-tsc/spec", 5 | "types": [ 6 | "jasmine", 7 | "node" 8 | ] 9 | }, 10 | "files": [ 11 | "src/test.ts", 12 | "src/polyfills.ts" 13 | ], 14 | "include": [ 15 | "src/**/*.spec.ts", 16 | "src/**/*.d.ts" 17 | ] 18 | } 19 | -------------------------------------------------------------------------------- /labs/view-models/package-lock.json: -------------------------------------------------------------------------------- 1 | { 2 | "lockfileVersion": 1 3 | } 4 | -------------------------------------------------------------------------------- /shared-library-abc-logging/.editorconfig: -------------------------------------------------------------------------------- 1 | # Editor configuration, see https://editorconfig.org 2 | root = true 3 | 4 | [*] 5 | charset = utf-8 6 | indent_style = space 7 | indent_size = 2 8 | insert_final_newline = true 9 | trim_trailing_whitespace = true 10 | 11 | [*.ts] 12 | quote_type = single 13 | 14 | [*.md] 15 | max_line_length = off 16 | trim_trailing_whitespace = false 17 | -------------------------------------------------------------------------------- /shared-library-abc-logging/.vscode/extensions.json: -------------------------------------------------------------------------------- 1 | { 2 | // For more information, visit: https://go.microsoft.com/fwlink/?linkid=827846 3 | "recommendations": ["angular.ng-template"] 4 | } 5 | -------------------------------------------------------------------------------- /shared-library-abc-logging/projects/browser-logger/ng-package.json: -------------------------------------------------------------------------------- 1 | { 2 | "$schema": "../../node_modules/ng-packagr/ng-package.schema.json", 3 | "dest": "../../dist/browser-logger", 4 | "lib": { 5 | "entryFile": "src/public-api.ts" 6 | } 7 | } -------------------------------------------------------------------------------- /shared-library-abc-logging/projects/browser-logger/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "browser-logger", 3 | "version": "0.0.1", 4 | "peerDependencies": { 5 | "@angular/common": "^17.0.0", 6 | "@angular/core": "^17.0.0" 7 | }, 8 | "dependencies": { 9 | "tslib": "^2.3.0" 10 | } 11 | } -------------------------------------------------------------------------------- /shared-library-abc-logging/projects/browser-logger/src/public-api.ts: -------------------------------------------------------------------------------- 1 | /* 2 | * Public API Surface of browser-logger 3 | */ 4 | 5 | export * from './lib/browser-logger.service'; 6 | export * from './lib/browser-logger.module'; 7 | -------------------------------------------------------------------------------- /shared-library-abc-logging/projects/browser-logger/tsconfig.lib.prod.json: -------------------------------------------------------------------------------- 1 | /* To learn more about this file see: https://angular.io/config/tsconfig. */ 2 | { 3 | "extends": "./tsconfig.lib.json", 4 | "compilerOptions": { 5 | "declarationMap": false 6 | }, 7 | "angularCompilerOptions": { 8 | "compilationMode": "partial" 9 | } 10 | } 11 | -------------------------------------------------------------------------------- /shared-library-abc-logging/src/assets/.gitkeep: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/DanWahlin/angular-architecture/3075810e55f78dab9bc263849265af3763364ea7/shared-library-abc-logging/src/assets/.gitkeep -------------------------------------------------------------------------------- /shared-library-abc-logging/src/environments/environment.prod.ts: -------------------------------------------------------------------------------- 1 | export const environment = { 2 | production: true 3 | }; 4 | -------------------------------------------------------------------------------- /shared-library-abc-logging/src/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/DanWahlin/angular-architecture/3075810e55f78dab9bc263849265af3763364ea7/shared-library-abc-logging/src/favicon.ico -------------------------------------------------------------------------------- /shared-library-abc-logging/src/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | SharedLibraryAbcLogging 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | -------------------------------------------------------------------------------- /shared-library-abc-logging/src/styles.css: -------------------------------------------------------------------------------- 1 | /* You can add global styles to this file, and also import other style files */ 2 | -------------------------------------------------------------------------------- /shared-library-abc-logging/tsconfig.app.json: -------------------------------------------------------------------------------- 1 | /* To learn more about this file see: https://angular.io/config/tsconfig. */ 2 | { 3 | "extends": "./tsconfig.json", 4 | "compilerOptions": { 5 | "outDir": "./out-tsc/app", 6 | "types": [] 7 | }, 8 | "files": [ 9 | "src/main.ts", 10 | "src/polyfills.ts" 11 | ], 12 | "include": [ 13 | "src/**/*.d.ts" 14 | ] 15 | } 16 | -------------------------------------------------------------------------------- /state-management/diy-store/.editorconfig: -------------------------------------------------------------------------------- 1 | # Editor configuration, see https://editorconfig.org 2 | root = true 3 | 4 | [*] 5 | charset = utf-8 6 | indent_style = space 7 | indent_size = 2 8 | insert_final_newline = true 9 | trim_trailing_whitespace = true 10 | 11 | [*.md] 12 | max_line_length = off 13 | trim_trailing_whitespace = false 14 | -------------------------------------------------------------------------------- /state-management/diy-store/.prettierrc: -------------------------------------------------------------------------------- 1 | { 2 | "tabWidth": 2, 3 | "useTabs": false, 4 | "singleQuote": true 5 | } 6 | -------------------------------------------------------------------------------- /state-management/diy-store/src/app/animations/index.ts: -------------------------------------------------------------------------------- 1 | export * from './expand-collapse.animations'; 2 | export * from './fade.animations'; 3 | -------------------------------------------------------------------------------- /state-management/diy-store/src/app/model/index.ts: -------------------------------------------------------------------------------- 1 | export * from './customer'; 2 | export * from './order'; 3 | -------------------------------------------------------------------------------- /state-management/diy-store/src/app/model/order.ts: -------------------------------------------------------------------------------- 1 | export class Order { 2 | id: number; 3 | customerId: number; 4 | orderItems: OrderItem[]; // NESTED! Generally not a good idea. 5 | } 6 | 7 | export class OrderItem { 8 | id: number; 9 | productName: string; 10 | itemCost: number; 11 | } 12 | -------------------------------------------------------------------------------- /state-management/diy-store/src/app/services/index.ts: -------------------------------------------------------------------------------- 1 | export * from './customer-orders-data.service'; 2 | -------------------------------------------------------------------------------- /state-management/diy-store/src/app/shared/index.ts: -------------------------------------------------------------------------------- 1 | export { calcAge, AgePipe } from './age.pipe'; 2 | export { calcFullName, FullNamePipe } from './fullname.pipe'; 3 | export { InputDateComponent } from './input-date.component'; 4 | -------------------------------------------------------------------------------- /state-management/diy-store/src/app/store/index.ts: -------------------------------------------------------------------------------- 1 | export * from './store-metadata'; 2 | export * from './store-operations'; 3 | -------------------------------------------------------------------------------- /state-management/diy-store/src/assets/.gitkeep: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/DanWahlin/angular-architecture/3075810e55f78dab9bc263849265af3763364ea7/state-management/diy-store/src/assets/.gitkeep -------------------------------------------------------------------------------- /state-management/diy-store/src/assets/fabio.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/DanWahlin/angular-architecture/3075810e55f78dab9bc263849265af3763364ea7/state-management/diy-store/src/assets/fabio.jpg -------------------------------------------------------------------------------- /state-management/diy-store/src/assets/klum.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/DanWahlin/angular-architecture/3075810e55f78dab9bc263849265af3763364ea7/state-management/diy-store/src/assets/klum.jpg -------------------------------------------------------------------------------- /state-management/diy-store/src/assets/lucy-liu.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/DanWahlin/angular-architecture/3075810e55f78dab9bc263849265af3763364ea7/state-management/diy-store/src/assets/lucy-liu.png -------------------------------------------------------------------------------- /state-management/diy-store/src/assets/missing-person.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/DanWahlin/angular-architecture/3075810e55f78dab9bc263849265af3763364ea7/state-management/diy-store/src/assets/missing-person.png -------------------------------------------------------------------------------- /state-management/diy-store/src/assets/tyson-beckford.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/DanWahlin/angular-architecture/3075810e55f78dab9bc263849265af3763364ea7/state-management/diy-store/src/assets/tyson-beckford.png -------------------------------------------------------------------------------- /state-management/diy-store/src/assets/zoolander.jpeg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/DanWahlin/angular-architecture/3075810e55f78dab9bc263849265af3763364ea7/state-management/diy-store/src/assets/zoolander.jpeg -------------------------------------------------------------------------------- /state-management/diy-store/src/environments/environment.prod.ts: -------------------------------------------------------------------------------- 1 | export const environment = { 2 | production: true 3 | }; 4 | -------------------------------------------------------------------------------- /state-management/diy-store/src/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/DanWahlin/angular-architecture/3075810e55f78dab9bc263849265af3763364ea7/state-management/diy-store/src/favicon.ico -------------------------------------------------------------------------------- /state-management/diy-store/src/main.ts: -------------------------------------------------------------------------------- 1 | import {bootstrapApplication} from '@angular/platform-browser'; 2 | 3 | import {AppComponent} from './app/app.component'; 4 | import {appConfig} from './app/app.config'; 5 | 6 | bootstrapApplication(AppComponent, appConfig) 7 | .catch(err => console.error(err));; 8 | -------------------------------------------------------------------------------- /state-management/diy-store/src/styles.css: -------------------------------------------------------------------------------- 1 | /* You can add global styles to this file, and also import other style files */ 2 | -------------------------------------------------------------------------------- /state-management/diy-store/tsconfig.app.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "./tsconfig.json", 3 | "compilerOptions": { 4 | "outDir": "./out-tsc/app", 5 | "types": [] 6 | }, 7 | "files": [ 8 | "src/main.ts", 9 | "src/polyfills.ts" 10 | ], 11 | "include": [ 12 | "src/**/*.d.ts" 13 | ] 14 | } 15 | -------------------------------------------------------------------------------- /state-management/diy-store/tsconfig.spec.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "./tsconfig.json", 3 | "compilerOptions": { 4 | "outDir": "./out-tsc/spec", 5 | "types": [ 6 | "jasmine", 7 | "node" 8 | ] 9 | }, 10 | "files": [ 11 | "src/test.ts", 12 | "src/polyfills.ts" 13 | ], 14 | "include": [ 15 | "src/**/*.spec.ts", 16 | "src/**/*.d.ts" 17 | ] 18 | } 19 | -------------------------------------------------------------------------------- /state-management/ngrx-data/.editorconfig: -------------------------------------------------------------------------------- 1 | # Editor configuration, see http://editorconfig.org 2 | root = true 3 | 4 | [*] 5 | charset = utf-8 6 | indent_style = space 7 | indent_size = 2 8 | insert_final_newline = true 9 | trim_trailing_whitespace = true 10 | 11 | [*.md] 12 | max_line_length = off 13 | trim_trailing_whitespace = false 14 | -------------------------------------------------------------------------------- /state-management/ngrx-data/.prettierrc: -------------------------------------------------------------------------------- 1 | { 2 | "tabWidth": 2, 3 | "useTabs": false, 4 | "singleQuote": true 5 | } 6 | -------------------------------------------------------------------------------- /state-management/ngrx-data/README.md: -------------------------------------------------------------------------------- 1 | # ngrx-data Demo 2 | 3 | Demo showing NgRx with Angular 4 | -------------------------------------------------------------------------------- /state-management/ngrx-data/e2e/app.e2e-spec.ts: -------------------------------------------------------------------------------- 1 | import { AppPage } from './app.po'; 2 | 3 | describe('angular-jumpstart App', () => { 4 | let page: AppPage; 5 | 6 | beforeEach(() => { 7 | page = new AppPage(); 8 | }); 9 | 10 | it('should display welcome message', () => { 11 | page.navigateTo(); 12 | expect(page.getParagraphText()).toEqual('Welcome to cm!'); 13 | }); 14 | }); 15 | -------------------------------------------------------------------------------- /state-management/ngrx-data/e2e/app.po.ts: -------------------------------------------------------------------------------- 1 | import { browser, by, element } from 'protractor'; 2 | 3 | export class AppPage { 4 | navigateTo() { 5 | return browser.get('/'); 6 | } 7 | 8 | getParagraphText() { 9 | return element(by.css('cm-root h1')).getText(); 10 | } 11 | } 12 | -------------------------------------------------------------------------------- /state-management/ngrx-data/e2e/tsconfig.e2e.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../tsconfig.json", 3 | "compilerOptions": { 4 | "outDir": "../out-tsc/e2e", 5 | "baseUrl": "./", 6 | "module": "commonjs", 7 | "target": "es5", 8 | "types": [ 9 | "jasmine", 10 | "jasminewd2", 11 | "node" 12 | ] 13 | } 14 | } 15 | -------------------------------------------------------------------------------- /state-management/ngrx-data/src/app/app.component.html: -------------------------------------------------------------------------------- 1 |
2 | 3 |
4 | -------------------------------------------------------------------------------- /state-management/ngrx-data/src/app/app.component.scss: -------------------------------------------------------------------------------- 1 | .title { 2 | margin-right: 1em; 3 | } 4 | -------------------------------------------------------------------------------- /state-management/ngrx-data/src/app/app.component.ts: -------------------------------------------------------------------------------- 1 | import { Component } from '@angular/core'; 2 | 3 | @Component({ 4 | selector: 'app-root', 5 | templateUrl: './app.component.html', 6 | styleUrls: ['./app.component.scss'] 7 | }) 8 | export class AppComponent {} 9 | -------------------------------------------------------------------------------- /state-management/ngrx-data/src/app/core/model/customer.ts: -------------------------------------------------------------------------------- 1 | export class Customer { 2 | id: number; 3 | name: string; 4 | city: string; 5 | orderTotal: number; 6 | } 7 | -------------------------------------------------------------------------------- /state-management/ngrx-data/src/app/core/model/order.ts: -------------------------------------------------------------------------------- 1 | export class Order { 2 | id: number; 3 | customerId: number; 4 | orderItems: OrderItem[]; 5 | } 6 | 7 | export class OrderItem { 8 | id: number; 9 | productName: string; 10 | itemCost: number; 11 | } 12 | -------------------------------------------------------------------------------- /state-management/ngrx-data/src/app/customers/customers-edit/customers-edit.component.scss: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/DanWahlin/angular-architecture/3075810e55f78dab9bc263849265af3763364ea7/state-management/ngrx-data/src/app/customers/customers-edit/customers-edit.component.scss -------------------------------------------------------------------------------- /state-management/ngrx-data/src/app/customers/customers.component.html: -------------------------------------------------------------------------------- 1 |

{{ title }}

2 |
3 | @if(customers$ | async; as customers) { 4 |
5 | 6 |
7 | } 8 | -------------------------------------------------------------------------------- /state-management/ngrx-data/src/app/customers/routes.ts: -------------------------------------------------------------------------------- 1 | import { Routes } from '@angular/router'; 2 | 3 | import { CustomersComponent } from './customers.component'; 4 | import { CustomersEditComponent } from './customers-edit/customers-edit.component'; 5 | 6 | export const routes: Routes = [ 7 | { path: '', component: CustomersComponent }, 8 | { path: ':id', component: CustomersEditComponent }, 9 | ]; 10 | -------------------------------------------------------------------------------- /state-management/ngrx-data/src/app/orders/orders.component.scss: -------------------------------------------------------------------------------- 1 | .orders-table { 2 | margin-top: 20px; 3 | } -------------------------------------------------------------------------------- /state-management/ngrx-data/src/app/orders/routes.ts: -------------------------------------------------------------------------------- 1 | import { Routes } from '@angular/router'; 2 | 3 | import { OrdersComponent } from './orders.component'; 4 | 5 | export const routes: Routes = [{ path: '', component: OrdersComponent }]; 6 | -------------------------------------------------------------------------------- /state-management/ngrx-data/src/app/shared/capitalize.pipe.ts: -------------------------------------------------------------------------------- 1 | import { Pipe, PipeTransform } from '@angular/core'; 2 | 3 | @Pipe({ name: 'capitalize' }) 4 | export class CapitalizePipe implements PipeTransform { 5 | transform(value: any) { 6 | if (value) { 7 | return value.charAt(0).toUpperCase() + value.slice(1); 8 | } 9 | return value; 10 | } 11 | } 12 | -------------------------------------------------------------------------------- /state-management/ngrx-data/src/app/store/entity-metadata.ts: -------------------------------------------------------------------------------- 1 | import { EntityMetadataMap } from '@ngrx/data'; 2 | 3 | const entityMetadata: EntityMetadataMap = { 4 | Customer: {}, 5 | Order: {} 6 | }; 7 | 8 | const pluralNames = { }; 9 | 10 | export const entityConfig = { 11 | entityMetadata, 12 | pluralNames 13 | }; -------------------------------------------------------------------------------- /state-management/ngrx-data/src/environments/environment.prod.ts: -------------------------------------------------------------------------------- 1 | export const environment = { 2 | production: true, 3 | apiUrlBase: '/api' 4 | }; 5 | -------------------------------------------------------------------------------- /state-management/ngrx-data/src/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/DanWahlin/angular-architecture/3075810e55f78dab9bc263849265af3763364ea7/state-management/ngrx-data/src/favicon.ico -------------------------------------------------------------------------------- /state-management/ngrx-data/src/tsconfig.app.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../tsconfig.json", 3 | "compilerOptions": { 4 | "outDir": "../out-tsc/app", 5 | "baseUrl": "./", 6 | "types": [] 7 | }, 8 | "files": [ 9 | "main.ts", 10 | "polyfills.ts" 11 | ], 12 | "include": [ 13 | "src/**/*.d.ts" 14 | ] 15 | } 16 | -------------------------------------------------------------------------------- /state-management/ngrx-data/src/tsconfig.spec.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../tsconfig.json", 3 | "compilerOptions": { 4 | "outDir": "../out-tsc/spec", 5 | "baseUrl": "./", 6 | "types": ["jasmine", "node"] 7 | }, 8 | "files": ["test.ts", "polyfills.ts"], 9 | "include": ["**/*.spec.ts", "**/*.d.ts"] 10 | } 11 | -------------------------------------------------------------------------------- /state-management/ngrx-data/src/typings.d.ts: -------------------------------------------------------------------------------- 1 | /* SystemJS module definition */ 2 | declare var module: NodeModule; 3 | interface NodeModule { 4 | id: string; 5 | } 6 | -------------------------------------------------------------------------------- /state-management/ngrx/.editorconfig: -------------------------------------------------------------------------------- 1 | # Editor configuration, see http://editorconfig.org 2 | root = true 3 | 4 | [*] 5 | charset = utf-8 6 | indent_style = space 7 | indent_size = 2 8 | insert_final_newline = true 9 | trim_trailing_whitespace = true 10 | 11 | [*.md] 12 | max_line_length = off 13 | trim_trailing_whitespace = false 14 | -------------------------------------------------------------------------------- /state-management/ngrx/.prettierrc: -------------------------------------------------------------------------------- 1 | { 2 | "tabWidth": 2, 3 | "useTabs": false, 4 | "singleQuote": true 5 | } 6 | -------------------------------------------------------------------------------- /state-management/ngrx/README.md: -------------------------------------------------------------------------------- 1 | # NgrxDemo 2 | 3 | Demo showing NgRx with Angular 4 | -------------------------------------------------------------------------------- /state-management/ngrx/e2e/app.e2e-spec.ts: -------------------------------------------------------------------------------- 1 | import { AppPage } from './app.po'; 2 | 3 | describe('angular-jumpstart App', () => { 4 | let page: AppPage; 5 | 6 | beforeEach(() => { 7 | page = new AppPage(); 8 | }); 9 | 10 | it('should display welcome message', () => { 11 | page.navigateTo(); 12 | expect(page.getParagraphText()).toEqual('Welcome to cm!'); 13 | }); 14 | }); 15 | -------------------------------------------------------------------------------- /state-management/ngrx/e2e/app.po.ts: -------------------------------------------------------------------------------- 1 | import { browser, by, element } from 'protractor'; 2 | 3 | export class AppPage { 4 | navigateTo() { 5 | return browser.get('/'); 6 | } 7 | 8 | getParagraphText() { 9 | return element(by.css('cm-root h1')).getText(); 10 | } 11 | } 12 | -------------------------------------------------------------------------------- /state-management/ngrx/e2e/tsconfig.e2e.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../tsconfig.json", 3 | "compilerOptions": { 4 | "outDir": "../out-tsc/e2e", 5 | "baseUrl": "./", 6 | "module": "commonjs", 7 | "target": "es5", 8 | "types": [ 9 | "jasmine", 10 | "jasminewd2", 11 | "node" 12 | ] 13 | } 14 | } 15 | -------------------------------------------------------------------------------- /state-management/ngrx/src/app/app.component.html: -------------------------------------------------------------------------------- 1 |
2 | 3 |
4 | -------------------------------------------------------------------------------- /state-management/ngrx/src/app/app.component.scss: -------------------------------------------------------------------------------- 1 | .title { 2 | margin-right: 1em; 3 | } 4 | -------------------------------------------------------------------------------- /state-management/ngrx/src/app/app.component.ts: -------------------------------------------------------------------------------- 1 | import { Component } from '@angular/core'; 2 | 3 | @Component({ 4 | selector: 'app-root', 5 | templateUrl: './app.component.html', 6 | styleUrls: ['./app.component.scss'] 7 | }) 8 | export class AppComponent {} 9 | -------------------------------------------------------------------------------- /state-management/ngrx/src/app/core/model/customer.ts: -------------------------------------------------------------------------------- 1 | export class Customer { 2 | id: number; 3 | name: string; 4 | city: string; 5 | orderTotal: number; 6 | } 7 | -------------------------------------------------------------------------------- /state-management/ngrx/src/app/core/model/order.ts: -------------------------------------------------------------------------------- 1 | export class Order { 2 | id: number; 3 | customerId: number; 4 | orderItems: OrderItem[]; 5 | } 6 | 7 | export class OrderItem { 8 | id: number; 9 | productName: string; 10 | itemCost: number; 11 | } 12 | -------------------------------------------------------------------------------- /state-management/ngrx/src/app/customers/customers-edit/customers-edit.component.scss: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/DanWahlin/angular-architecture/3075810e55f78dab9bc263849265af3763364ea7/state-management/ngrx/src/app/customers/customers-edit/customers-edit.component.scss -------------------------------------------------------------------------------- /state-management/ngrx/src/app/customers/customers.component.html: -------------------------------------------------------------------------------- 1 |

{{ title }}

2 |
3 | @if(customers$ | async; as customers) { 4 |
5 | 6 |
7 | } 8 | -------------------------------------------------------------------------------- /state-management/ngrx/src/app/orders/orders.component.scss: -------------------------------------------------------------------------------- 1 | .orders-table { 2 | margin-top: 20px; 3 | } -------------------------------------------------------------------------------- /state-management/ngrx/src/app/shared/capitalize.pipe.ts: -------------------------------------------------------------------------------- 1 | import { Pipe, PipeTransform } from '@angular/core'; 2 | 3 | @Pipe({ name: 'capitalize' }) 4 | export class CapitalizePipe implements PipeTransform { 5 | transform(value: any) { 6 | if (value) { 7 | return value.charAt(0).toUpperCase() + value.slice(1); 8 | } 9 | return value; 10 | } 11 | } 12 | -------------------------------------------------------------------------------- /state-management/ngrx/src/app/store/actions/index.ts: -------------------------------------------------------------------------------- 1 | export * from './data.actions'; 2 | export * from './customer.actions'; 3 | export * from './order.actions'; 4 | -------------------------------------------------------------------------------- /state-management/ngrx/src/app/store/index.ts: -------------------------------------------------------------------------------- 1 | export * from './actions'; 2 | export * from './reducers'; 3 | export * from './services'; -------------------------------------------------------------------------------- /state-management/ngrx/src/app/store/services/data-error.service.ts: -------------------------------------------------------------------------------- 1 | export class DataServiceError { 2 | constructor(public error: any, public requestData: T) {} 3 | } 4 | -------------------------------------------------------------------------------- /state-management/ngrx/src/app/store/services/index.ts: -------------------------------------------------------------------------------- 1 | export { DataServiceError } from './data-error.service'; 2 | 3 | export * from './customer-data.service'; 4 | export * from './order-data.service'; 5 | 6 | export * from './customer.selectors'; 7 | export * from './order.selectors'; 8 | -------------------------------------------------------------------------------- /state-management/ngrx/src/environments/environment.prod.ts: -------------------------------------------------------------------------------- 1 | export const environment = { 2 | production: true, 3 | apiUrlBase: '/api' 4 | }; 5 | -------------------------------------------------------------------------------- /state-management/ngrx/src/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/DanWahlin/angular-architecture/3075810e55f78dab9bc263849265af3763364ea7/state-management/ngrx/src/favicon.ico -------------------------------------------------------------------------------- /state-management/ngrx/src/tsconfig.app.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../tsconfig.json", 3 | "compilerOptions": { 4 | "outDir": "../out-tsc/app", 5 | "baseUrl": "./", 6 | "types": [] 7 | }, 8 | "files": [ 9 | "main.ts", 10 | "polyfills.ts" 11 | ], 12 | "include": [ 13 | "src/**/*.d.ts" 14 | ] 15 | } 16 | -------------------------------------------------------------------------------- /state-management/ngrx/src/tsconfig.spec.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../tsconfig.json", 3 | "compilerOptions": { 4 | "outDir": "../out-tsc/spec", 5 | "baseUrl": "./", 6 | "types": ["jasmine", "node"] 7 | }, 8 | "files": ["test.ts", "polyfills.ts"], 9 | "include": ["**/*.spec.ts", "**/*.d.ts"] 10 | } 11 | -------------------------------------------------------------------------------- /state-management/ngrx/src/typings.d.ts: -------------------------------------------------------------------------------- 1 | /* SystemJS module definition */ 2 | declare var module: NodeModule; 3 | interface NodeModule { 4 | id: string; 5 | } 6 | -------------------------------------------------------------------------------- /state-management/observable-store/.editorconfig: -------------------------------------------------------------------------------- 1 | # Editor configuration, see https://editorconfig.org 2 | root = true 3 | 4 | [*] 5 | charset = utf-8 6 | indent_style = space 7 | indent_size = 2 8 | insert_final_newline = true 9 | trim_trailing_whitespace = true 10 | 11 | [*.ts] 12 | quote_type = single 13 | 14 | [*.md] 15 | max_line_length = off 16 | trim_trailing_whitespace = false 17 | -------------------------------------------------------------------------------- /state-management/observable-store/.vscode/extensions.json: -------------------------------------------------------------------------------- 1 | { 2 | // For more information, visit: https://go.microsoft.com/fwlink/?linkid=827846 3 | "recommendations": ["angular.ng-template"] 4 | } 5 | -------------------------------------------------------------------------------- /state-management/observable-store/src/app/app.component.html: -------------------------------------------------------------------------------- 1 |
2 | 3 |
4 | -------------------------------------------------------------------------------- /state-management/observable-store/src/app/app.component.scss: -------------------------------------------------------------------------------- 1 | .title { 2 | margin-right: 1em; 3 | } 4 | -------------------------------------------------------------------------------- /state-management/observable-store/src/app/app.component.ts: -------------------------------------------------------------------------------- 1 | import { Component } from '@angular/core'; 2 | 3 | @Component({ 4 | selector: 'app-root', 5 | templateUrl: './app.component.html', 6 | styleUrls: ['./app.component.scss'] 7 | }) 8 | export class AppComponent {} 9 | -------------------------------------------------------------------------------- /state-management/observable-store/src/app/core/model/customer.ts: -------------------------------------------------------------------------------- 1 | export interface Customer { 2 | id: number; 3 | name: string; 4 | city: string; 5 | orderTotal: number; 6 | } 7 | -------------------------------------------------------------------------------- /state-management/observable-store/src/app/core/model/index.ts: -------------------------------------------------------------------------------- 1 | export * from './customer'; 2 | export * from './order'; -------------------------------------------------------------------------------- /state-management/observable-store/src/app/core/model/order.ts: -------------------------------------------------------------------------------- 1 | export interface Order { 2 | id: number; 3 | customerId: number; 4 | orderItems: OrderItem[]; 5 | } 6 | 7 | export interface OrderItem { 8 | id: number; 9 | productName: string; 10 | itemCost: number; 11 | } 12 | -------------------------------------------------------------------------------- /state-management/observable-store/src/app/customers/customers-edit/customers-edit.component.scss: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/DanWahlin/angular-architecture/3075810e55f78dab9bc263849265af3763364ea7/state-management/observable-store/src/app/customers/customers-edit/customers-edit.component.scss -------------------------------------------------------------------------------- /state-management/observable-store/src/app/customers/customers.component.html: -------------------------------------------------------------------------------- 1 |

{{ title }}

2 |
3 | @if(customers$ | async; as customers) { 4 |
5 | 6 |
7 | } 8 | -------------------------------------------------------------------------------- /state-management/observable-store/src/app/customers/routes.ts: -------------------------------------------------------------------------------- 1 | import { Routes } from '@angular/router'; 2 | 3 | import { CustomersComponent } from './customers.component'; 4 | import { CustomersEditComponent } from './customers-edit/customers-edit.component'; 5 | 6 | export const routes: Routes = [ 7 | { path: '', component: CustomersComponent }, 8 | { path: ':id', component: CustomersEditComponent }, 9 | ]; 10 | -------------------------------------------------------------------------------- /state-management/observable-store/src/app/orders/orders.component.scss: -------------------------------------------------------------------------------- 1 | .orders-table { 2 | margin-top: 20px; 3 | } -------------------------------------------------------------------------------- /state-management/observable-store/src/app/orders/routes.ts: -------------------------------------------------------------------------------- 1 | import { Routes } from '@angular/router'; 2 | 3 | import { OrdersComponent } from './orders.component'; 4 | 5 | export const routes: Routes = [{ path: '', component: OrdersComponent }]; 6 | -------------------------------------------------------------------------------- /state-management/observable-store/src/app/shared/capitalize.pipe.ts: -------------------------------------------------------------------------------- 1 | import { Pipe, PipeTransform } from '@angular/core'; 2 | 3 | @Pipe({ name: 'capitalize' }) 4 | export class CapitalizePipe implements PipeTransform { 5 | transform(value: any) { 6 | if (value) { 7 | return value.charAt(0).toUpperCase() + value.slice(1); 8 | } 9 | return value; 10 | } 11 | } 12 | -------------------------------------------------------------------------------- /state-management/observable-store/src/app/shared/interfaces.ts: -------------------------------------------------------------------------------- 1 | import { Customer, Order } from '../core/model'; 2 | 3 | export interface StoreState { 4 | customers: Customer[]; 5 | customer: Customer; 6 | orders: Order[]; 7 | } -------------------------------------------------------------------------------- /state-management/observable-store/src/assets/.gitkeep: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/DanWahlin/angular-architecture/3075810e55f78dab9bc263849265af3763364ea7/state-management/observable-store/src/assets/.gitkeep -------------------------------------------------------------------------------- /state-management/observable-store/src/environments/environment.prod.ts: -------------------------------------------------------------------------------- 1 | export const environment = { 2 | production: true 3 | }; 4 | -------------------------------------------------------------------------------- /state-management/observable-store/src/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/DanWahlin/angular-architecture/3075810e55f78dab9bc263849265af3763364ea7/state-management/observable-store/src/favicon.ico -------------------------------------------------------------------------------- /state-management/observable-store/src/styles.css: -------------------------------------------------------------------------------- 1 | /* You can add global styles to this file, and also import other style files */ 2 | -------------------------------------------------------------------------------- /state-management/observable-store/tsconfig.app.json: -------------------------------------------------------------------------------- 1 | /* To learn more about this file see: https://angular.io/config/tsconfig. */ 2 | { 3 | "extends": "./tsconfig.json", 4 | "compilerOptions": { 5 | "outDir": "./out-tsc/app", 6 | "types": [] 7 | }, 8 | "files": [ 9 | "src/main.ts", 10 | "src/polyfills.ts" 11 | ], 12 | "include": [ 13 | "src/**/*.d.ts" 14 | ] 15 | } 16 | --------------------------------------------------------------------------------