Skip to content

DanWahlin/angular-architecture

Repository files navigation

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