Angular Developer Training - Advanced
Course Description
This course follows on from the introductory course on Angular and covers the more advanced but widely used features that Angular has to offer. It covers many advanced component techniques, creating custom attribute and structural directives, asynchronous programming using the rxjs library. It also covers creating a Progressive Web Application using Angular, using authentication and authorization routing features and automated testing. It covers creating a complex project using nx and deploying your app using a SSL certificate. This course will bring the skills of experienced Angular developers to the next level.
Duration: 5 days
Prerequisites
Participants should be familiar with the basic Angular concepts including angular cli, components, services, directives, pipes, data binding and dependency injection.
Advanced Component Topics
Child and Parent components Inter component communication Host Template Sub components of a tag Make a computed property available using a custom setter ngOnChanges @ViewChild / @ViewChildren, static / dynamic types, ngAfterViewInit Monitoring Children Access to parent @Host Styling parent - :host pseudo selector Modifying DOM properties of host @HostBinding Content projection Styling parent component - the :host pseudo selector Component Lifecycle Built-in and custom pipes
Advanced Directives
Customisation Custom Directive Custom Structural Directive
Forms & Reactive Forms
FormsControl and FormGroups ngModel and ngForm Form Validation FormBuilder Custom Validator Subscribing to a form
Asynchronous Programming
Asynchronous JavaScript Callbacks -> Promises -> Observables async / await Using HttpClient to make Ajax calls Reactive Programming RXJS Marble diagrams The Async Pipe
Advanced Styling
Advanced css techniques SASS Understanding the Shadow DOM Material design Themed components
Automated Testing
Jasmine test framework Karma test runner Writing unit tests Writing component tests Testing Best Practices
State Management
Meaning of State Simple state management More complex state management NgRx library NgRx concepts - store, effects
Advanced Routing
Route parameters Routes with multiple parameters Query parameters Dynamically created navigation Authentication & Authorization Role based routing with authentication Route Guards External Authentication provider JWT
Angular 16 New Features
Signals Stand-alone components Required Inputs Changes To Routing Vite Development Server Self-closing tags
Building And Deployment
Development and production environments Configuration settings Building Deploying Hosting with SSL
Angular Architecture
Modules - importing and exporting - grouping components and directives into reusable modules Architecting a complex project with nx Domain Driven Design Micro Frontends Strategic Design Server-side Rendering