A discussion about Angular for .NET developers. There are many transferable skills that make .NET developers excellent Angular developers. What is it that makes your skills unique and desirable for an Angular team?
Sample Angular Application: The GitHub repository contains the source code for the an application that demonstrates some of the patterns, layers, and project structure that will be familiar to .NET developers. View online: https://github-search-api-with-angular.firebaseapp.com
The sample application demonstrates the following:
- a solution-based approach using Angular Workspace
- using shared library projects
- cross-cutting concern libraries
- application feature libraries
- framework libraries (i.e., rule engine)
- utility libraries (HTTP/API access)
- a solution with multiple application projects (Single-page Application)
- service and business logic layers
- reactive programming using Rxjs
- Microsoft
- Anders Hejlsberg, Erich Gamma, Steve Lucco
- Who is Michael Collins?
- Static Typing
- static language analysis (tooling/IDE)
- Annotations (Decorators)
- Class-based Programming
- classes, abstract classes
- interfaces
- enums
- Object-Oriented Programming
- Encapsulation
- Inheritance
- Abstraction
- Polymorphism
- Collections
- IEnumerable/IIterator
- Observable/Observer
- Generics
- Support in multiple IDEs
- Adoption in Other JavaScript Frameworks
- React, Vue
- Server-Side
- NestJS
- NodeJS
- Libraries
- package and publish
- Has the name Visual Studio
- Included in VS since 2013
- Package Management
- npm/nuget
- Modules
- Components
- Services
- Dependency Injection
- Monorepo --> Solution
- Many projects (applications, libraries, schematics)
- Scaffolding (Angular CLI)
- projects, applications, libraries, schematics
- modules, services, components, directives, pipes
- Terminal
- scaffold
- build, test, lint
- serve
- Unit and Integration Test Support
Create a new workspace (solution).
create-nx-workspace workspace --create-application --npm-scope=denver --style=scss --dry-runCreate a new application project in the workspace.
ng generate application webOne --framework=angular --style=scss --unit-test-runner=jest --e2e-test-runner=cypress --routingAdd a module (think assembly/library) that is internal to the application. A container for related things (services, components, models, etc.).
ng generate module products --project=web-oneAdd a new component to the ProductsModule.
ng generate component products/productList --project=web-oneAdd a service to the module to provide an API for the ProductsModule.
ng generate service products/ products --project=web-oneCreate a new library project that can be shared with all applications and/or any other library projects.
ng generate library loggingAdd a service to the logging module. Creates API end-points for the Logging library.
ng generate service logging --project=loggingBuild your web application.
ng build web-oneServe the application to view in browser.
ng serve web-one- Composite
- Template Method
- Facade
- Any design pattern, really!
- n-tier
- service APIs
- Component/Controller
- MVC
Matt Vaughn
- web: https://angularlicio.us
- podcast
- blog
- resources
- email: matt@angularlicio.us
- twitter: @angularlicious
- Angularlicious YouTube Channel
- Who built Microsoft TypeScript and why
- Typescript History
- Typescript Official
- Anders Hejlsberg
- Typescript Documentation
- Typescript Tutorials
- Angular.io
- Angular.io :: Getting Started
- Flipboard: Angularlicio.us On Like Donkey Ko(ng)
- Rangle.io :: Learning Resources
- Angular by Asim Hussain
- Angular from Theory to Practice
- FreeCodeCamp.org: Free 33-part Course by Dan Wahlin
- Angular Fundamentals by Microsoft
- Reactive Extensions
- Overview and historical information
- Reactive Extensions for .NET
- Introduction to Reactive Programming you've been missing" by Andre Staltz
- Angular.io Rxjs
- Rx Observable
- Dozens of Rxjs Resources
- Rxjs Resources