Skip to content

40+ angular coding exercises (forms, routing, pipes, directives, interceptors, guards, hooks, rxjs, etc.)

Notifications You must be signed in to change notification settings

seanmisra/angular-coding-exercises

Repository files navigation

AngularCodingExercises

  1. Set up Hello World application with ng new my-app
  2. Demonstrate two-way binding
  3. Retrieve mock data using HttpClient
  4. Demonstrate parent-child and child-parent interactions
  5. Demonstrate content projection with ng-content
  6. Using a structural directive render content conditionally (if possible, use ng-template)
  7. Use ngIf and ngFor together, w/o adding more than one element to the DOM
  8. Create a directive that will give an element a random color everytime you load the page
  9. Example of dynamic routing
  10. Example of ngTemplateOutlet
  11. Reactive Forms example
  12. Example of ngSwitch
  13. Implement a custom pipe with PipeTransform
  14. Demonstrate a routing guard with CanActivate
  15. Demonstrate usage of rxjs operators pipe and map (ideally together)
  16. Create a typeahead input that uses the rxjs operators debounceTime and distinctUntilChanged
  17. Demonstrate a use case for the forkJoin rxjs operator
  18. Write several karma/jasmine test cases that pass
  19. Create a typeahead input that uses rxjs switchMap
  20. Demonstrate use of rxjs combineLatest
  21. Demonstrate using rxjs take, first, last
  22. Demonstrate using rxjs takeUntil
  23. Example of child (nested) routes
  24. rxjs error handling: catchError
  25. rxjs error handling: handle error within subscription
  26. Example of async/await (instead of then with Promise)
  27. Implement lazy loading for a feature module
  28. Example of ngrx to save state (ex: when navigating btw routes preserve a value in form)
  29. Set up mini node/express back-end and call API to retrieve data
  30. 3 ways to dynamically style in the template (ngStyle, ngClass, style.x)
  31. FormBuilder example
  32. set/get/delete cookie (ngx-cookie-service)
  33. ReplaySubject vs Subject (demonstrate difference)
  34. ViewChild (demonstrate static prop: true vs false) - Angular 9
  35. Async pipe use cases
  36. Nullish Coalescing - Angular 12
  37. Create components (using ViewContainerRef createComponent()) - Angular 13
  38. Non-Singleton service example
  39. ngOnInit vs ngAfterContentInit vs ngAfterViewInit (demonstrate timing differences)
  40. rxjs timer vs setInterval use case
  41. HttpInterceptor (intercept a request and inject an auth token)
  42. Pure vs Impure Pipe (demonstrate the differences including when making changes by reference or not)

Commits correspond to each exercises

About

40+ angular coding exercises (forms, routing, pipes, directives, interceptors, guards, hooks, rxjs, etc.)

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published