Angular Architecture

This code sample demonstrates different Angular Architecture concepts. It's used in the Angular Architecture and Best Practices video course on Pluralsight (https://www.pluralsight.com/courses/angular-architecture-best-practices) and in the Angular Architecture and Best Practices instructor-led training course (https://codewithdan.com/products/angular-architecture).

Running the Application

1. Install the Angular CLI: npm install -g @angular/cli

2. Open the demos folder and run npm install

3. Run ng serve -o in the demos folder to start the server and launch the app

Main Demos

Name	Description
Communication	Show services and subjects to provide communication for components.
Component Inheritance	inheriting components
Features Modules	Example structure with NgModules
Http Client RxJS	RxJS to combine results with operators
Pipes and Functions	Pipes
Planning	Planning tips for your app
Signals	Simple Signals demo
Structuring Components	Component presentation with change detection
Subjects	Simple use of each Subject type
View Models	Progressive examples of where view models are useful

Additional Demos

Name	Description
Cloning	Run the project in the cloning folder
Input/Output Properties	Run the project in the input-output-demo project
Shared Library	Run the project in the shared-library-example project
State Management	Open the state-management folder and run any of the demos
State - DIY Store	Open the state-management/diy-store folder and start here with a simple "do it yourself" store with subjects and observables
State - NgRx	Open the state-management/ngrx folder
State - ngrx-data	Open the state-management/ngrx-data folder
State - Observable Store	Open the state-management/observable-store folder Observable Store library

The Angular JumpStart Application

You can find an example of an application that follows the rules in this course at https://github.com/DanWahlin/Angular-JumpStart