29 October 2020

#Angular

#Angular
Level Topic Subtopics
Basic Introduction What is Angular, Angular vs AngularJS, Features, Angular Architecture, Angular CLI
Components Component Basics, Templates, Metadata, Lifecycle Hooks, Component Interaction
Data Binding Interpolation, Property Binding, Event Binding, Two-way Binding, Template Reference Variables
Directives Structural Directives (ngIf, ngFor), Attribute Directives, Built-in Directives, Custom Directives, ngSwitch
Modules NgModule, Root Module, Feature Modules, Shared Modules, Lazy Loading Modules
Intermediate Services & DI Creating Services, Dependency Injection, Hierarchical Injectors, providedIn, Service Scopes
Forms Template-driven Forms, Reactive Forms, FormGroup & FormControl, Form Validation, Async Validators
Routing RouterModule, RouterOutlet, Route Guards, Route Parameters, Child Routes
Pipes Built-in Pipes, Async Pipe, Parameterized Pipes, Pure vs Impure Pipes, Custom Pipes
Observables & RxJS Observable Basics, Operators (map, filter, switchMap), Subjects & BehaviorSubjects, Async/Await vs Observables, Error Handling
Advanced Change Detection Zone.js, Change Detection Strategies, OnPush Strategy, DetectChanges(), Performance Tuning
State Management NgRx, Akita, NGXS, Redux Pattern, Store & Effects
HTTP Client HttpClientModule, Interceptors, Error Handling, Retry & Caching, REST API Integration
Testing Unit Testing with Jasmine & Karma, TestBed, Mock Services, E2E Testing with Protractor, Cypress
Performance Optimization Lazy Loading, Preloading Strategies, Ahead-of-Time Compilation (AOT), Tree Shaking, Bundle Optimization
Expert Architecture & Patterns Monorepos with Nx, Micro-Frontends, Clean Architecture in Angular, Modular Federation, Smart vs Dumb Components
Security XSS Protection, CSP, DomSanitizer, JWT Authentication, OAuth2 & OpenID Connect
Internationalization i18n, Localization, Transloco, Angular Built-in i18n, Dynamic Language Switching
Advanced RxJS Higher-order Observables, Multicasting, Custom Operators, Marble Testing, Backpressure Handling
Deployment & CI/CD Angular Universal (SSR), Dockerizing Angular Apps, CI/CD Pipelines, Hosting (Firebase, AWS, Azure), SEO Optimization

1. Angular Core

  1. What is Angular and how is it different from AngularJS?
  2. What are Angular Modules and why are they important?
  3. What are Angular decorators? Name a few.
  4. Explain the role of NgModule in Angular.
  5. What is a singleton pattern in Angular modules?
  6. What is Ivy in Angular?
  7. What is Angular CLI and its benefits?
  8. What is Ahead-of-Time (AOT) compilation?
  9. Explain Angular?s compilation process.
  10. Difference between Angular compiler (ngc) and TypeScript compiler (tsc)?
  11. How does Angular support TypeScript features?
  12. What is tree-shaking in Angular?
  13. Explain Angular zones and their purpose.
  14. What is Angular Universal?
  15. How does Angular handle internationalization (i18n)?
  16. What is differential loading in Angular?
  17. What are polyfills in Angular?
  18. What are Angular schematics?
  19. How does Angular handle DOM sanitization?
  20. What is the purpose of Angular package.json configuration?

2. Components

  1. What is a component in Angular?
  2. How do you create a component using Angular CLI?
  3. What is a component selector?
  4. Difference between inline and external templates?
  5. What are component lifecycle hooks? Explain them.
  6. How does ngOnInit differ from a constructor?
  7. How do you pass data from parent to child component?
  8. How do you emit events from child to parent?
  9. What is ViewEncapsulation in Angular?
  10. Difference between Shadow DOM and Emulated encapsulation?
  11. How do you use @Input() and @Output() decorators?
  12. What is Content Projection (ng-content)?
  13. Difference between ViewChild and ContentChild?
  14. What are dynamic components?
  15. How do you reuse components across modules?
  16. What are smart and dumb components?
  17. How do you style Angular components?
  18. How do you test a component in Angular?
  19. What is OnPush change detection in components?
  20. What are standalone components in Angular?

3. Directives

  1. What are Angular directives?
  2. Difference between structural and attribute directives?
  3. Examples of built-in directives in Angular?
  4. What is *ngIf and how does it work?
  5. What is *ngFor and how does trackBy improve performance?
  6. What is ngSwitch directive?
  7. How do you create a custom directive?
  8. Difference between host binding and host listener?
  9. What is ngClass and ngStyle directive?
  10. What are async pipes and how are they used with directives?
  11. Can you apply multiple directives to the same element?
  12. Difference between ElementRef and Renderer2?
  13. What is a structural directive marker (*)?
  14. How do you conditionally apply classes using directives?
  15. What are template reference variables in directives?
  16. What is the purpose of Angular template syntax #var?
  17. How do you manipulate DOM safely in directives?
  18. How to share data between directives?
  19. Difference between attribute binding and property binding?
  20. Best practices when creating custom directives?

4. Services & Dependency Injection

  1. What is a service in Angular?
  2. Why do we use services instead of duplicating logic in components?
  3. What is Dependency Injection (DI)?
  4. What is the difference between providedIn: root and module-level providers?
  5. What is hierarchical dependency injection in Angular?
  6. What happens if a service is provided at component level?
  7. How do you create a singleton service?
  8. How do you inject a service into another service?
  9. Difference between useClass, useValue, useFactory providers?
  10. What is a multi-provider in Angular?
  11. How does Angular resolve dependencies at runtime?
  12. What is the purpose of Injectable() decorator?
  13. What is Optional() dependency in Angular?
  14. What is Self() and SkipSelf() in Angular DI?
  15. How does Angular handle circular dependency in DI?
  16. What is the difference between root injector and module injector?
  17. How do you configure environment-based services?
  18. How do you mock a service in unit testing?
  19. What is InjectionToken in Angular?
  20. Explain the difference between service scope in lazy loaded vs eagerly loaded modules.

5. Routing & Navigation

  1. How is routing implemented in Angular?
  2. What is RouterModule and how is it configured?
  3. What are route parameters?
  4. How do you implement query parameters in Angular routing?
  5. What are route guards? Types of guards?
  6. Difference between CanActivate and CanDeactivate?
  7. What is CanLoad in routing?
  8. What is lazy loading in Angular routing?
  9. How to preload modules in routing?
  10. What is RouterOutlet directive?
  11. What is ActivatedRoute in Angular?
  12. Difference between snapshot and observable in ActivatedRoute?
  13. How do you handle route navigation programmatically?
  14. How to implement child routes in Angular?
  15. Difference between HashLocationStrategy and PathLocationStrategy?
  16. What is the difference between forRoot and forChild in routing?
  17. How do you create a custom route matcher?
  18. How do you implement wildcard routes?
  19. What is route resolver in Angular?
  20. How do you pass state while navigating routes?

6. Forms (Template-driven & Reactive)

  1. Difference between template-driven and reactive forms?
  2. What are form controls?
  3. What is FormGroup in reactive forms?
  4. How do you perform form validation in Angular?
  5. How do you create custom validators?
  6. What is async validation?
  7. What is FormBuilder in Angular?
  8. Difference between setValue() and patchValue()?
  9. How do you disable form controls dynamically?
  10. What is ngModel in Angular?
  11. How do you bind form data to components?
  12. How to reset a form programmatically?
  13. What is touched vs dirty in Angular forms?
  14. How do you handle cross-field validation?
  15. How do you show validation error messages dynamically?
  16. What is a dynamic form in Angular?
  17. Difference between synchronous and asynchronous validators?
  18. How do you test reactive forms?
  19. What is updateOn in reactive forms?
  20. What is the purpose of AbstractControl in Angular?

7. RxJS & Observables

  1. What is RxJS in Angular?
  2. Difference between Observable and Promise?
  3. What is a Subject in RxJS?
  4. Difference between Subject, BehaviorSubject, ReplaySubject?
  5. What is an Operator in RxJS? Examples?
  6. What is pipe() in RxJS?
  7. What is map, filter, and switchMap in RxJS?
  8. Difference between mergeMap, concatMap, and exhaustMap?
  9. What is debounceTime in RxJS?
  10. How do you unsubscribe from Observables?
  11. What are hot and cold Observables?
  12. What is shareReplay in RxJS?
  13. What is forkJoin operator?
  14. What is combineLatest operator?
  15. What is race operator in RxJS?
  16. How to create a custom Observable?
  17. What is takeUntil in RxJS?
  18. How does Angular use RxJS internally?
  19. Difference between async/await and Observables?
  20. What is the purpose of firstValueFrom and lastValueFrom?

8. Change Detection

  1. What is Angular?s change detection?
  2. What is the default change detection strategy?
  3. Difference between default and OnPush strategy?
  4. What is Zone.js in Angular?
  5. How to manually trigger change detection?
  6. What is ApplicationRef.tick() in Angular?
  7. What is ChangeDetectorRef in Angular?
  8. Difference between detectChanges() and markForCheck()?
  9. How does Angular optimize change detection?
  10. What is immutability and why does it help with OnPush?
  11. What is ngDoCheck lifecycle hook?
  12. How does Angular detect changes in arrays and objects?
  13. Difference between pure and impure pipes in change detection?
  14. What is the async pipe?s role in change detection?
  15. How does trackBy improve *ngFor performance?
  16. How does Angular handle change detection with observables?
  17. What happens when Zone.js is removed from Angular?
  18. Can you disable change detection temporarily?
  19. How do you profile Angular change detection performance?
  20. What is the difference between manual and automatic change detection?

9. Testing

  1. How do you unit test components in Angular?
  2. What is TestBed in Angular?
  3. What is Jasmine in Angular testing?
  4. What is Karma test runner?
  5. How do you mock services in Angular unit tests?
  6. What is a spy in Jasmine?
  7. How do you test HTTP requests in Angular?
  8. What is HttpTestingController?
  9. Difference between unit tests and integration tests?
  10. What is Protractor in Angular?
  11. What is Cypress and can it be used with Angular?
  12. What are async and fakeAsync utilities in Angular testing?
  13. How do you test form validation in Angular?
  14. How do you test route guards in Angular?
  15. How to test directives in Angular?
  16. How do you test pipes in Angular?
  17. What is Angular testing module?
  18. How do you test event emitters?
  19. Difference between shallow testing and deep testing?
  20. Best practices for Angular unit testing?

10. Performance & Best Practices

  1. How do you improve performance in Angular apps?
  2. What is Ahead-of-Time (AOT) compilation?
  3. What is Tree-shaking in Angular?
  4. How to optimize change detection for large applications?
  5. Best practices for structuring Angular applications?
  6. How does lazy loading improve performance?
  7. How do you reduce bundle size in Angular?
  8. What is Angular CLI build optimizer?
  9. What are service workers in Angular?
  10. How to implement server-side rendering (SSR)?
  11. What is differential loading and its benefits?
  12. How to handle memory leaks in Angular apps?
  13. What are best practices for RxJS usage?
  14. How to implement caching in Angular?
  15. Difference between ngZone run() and runOutsideAngular()?
  16. How to optimize *ngFor performance?
  17. What are Angular PWA best practices?
  18. How to secure Angular applications?
  19. What are Angular best practices for folder structure?
  20. How to improve initial load time in Angular apps?