Learn advanced Angular: forms, reactive patterns, Angular Material, unit testing, and deployment.

Become an AngularJS Developer

This module teaches advanced Angular topics, focusing on forms, Angular Material, unit testing, and deploying apps.

We’ll start by learning how to collect user data with forms, using reactive patterns, and modifying forms dynamically. Next, we’ll learn reactive forms, handling groups, controls, and validation. We’ll also work with template forms, using two-way data binding and handling form submissions. Custom validators and async validation will enhance our forms.

We’ll set up authentication with Firebase and cover user registration and login. We’ll look at Angular Material and add UI controls, dialogs, and tables. Unit testing will teach us to test components, services, and forms.

Finally, we’ll learn to deploy Angular apps, optimize bundles, handle errors, and debug. Hands-on projects and challenges will reinforce your learning. By the end, we’ll be able to create robust, maintainable, and scalable Angular applications ready for production.

Angular Deep Dive

```
catchError((error: HttpErrorResponse) => {
      console.error(error);
      return throwError(() => error);
})
```

```
catchError((HttpErrorResponse: error) => {
      console(error);
      return throwError(() => error);
})
```

```
catchError((HttpErrorResponse:error) => {
      console.error(error);
      return error;
})
```

```
catchError((error: HttpErrorResponse) => {
      console.error(error);
      return throwError();
})
```

Suppose we want to catch an error in an HTTP request. Which is the correct approach for it?

Suppose we want to catch an error in an HTTP request. Which is the correct approach for it?

```
private handleError(HttpErrorResponse: error) {
  switch(error) {
    case HttpStatusCode.InternalServerError:
      console.error(‘Server error:’, error.error);
      break;
    case HttpStatusCode.BadRequest:
      console.error(‘Request error:’, error.error);
      break;
  }
  return throwError(() => error);
}
```

```
private handleError(HttpErrorResponse: error) {
  switch(error.status) {
    case InternalServerError:
      console.error(‘Server error:’, error.error);
      break;
    case BadRequest:
      console.error(‘Request error:’, error.error);
      break;
  }
  return throwError(() => error);
}
```

```
private handleError(error: HttpErrorResponse) {
  switch(error.status) {
    case HttpStatusCode.InternalServerError:
      console.error(‘Server error:’, error.error);
      break;
    case HttpStatusCode.BadRequest:
      console.error(‘Request error:‘, error.error);
      break;
  }
  return throwError(() => error);
}
```

```
private handleError(error: HttpErrorResponse) {
  switch(error.status) {
    case InternalServerError | BadRequest
      console.error(‘Server error:’, error.error);
      break;
  }
  return throwError(() => error);
}
```

If we want to specifically check for two types of errors in an HTTP request, namely `InternalServerError` and `BadRequest`, then which approach do we choose?


If we want to specifically check for two types of errors in an HTTP request, namely <code>InternalServerError</code> and <code>BadRequest</code>, then which approach do we choose?

**(Fill in the blank.)** ________ is an enumeration that contains a list of all HTTP status codes.

(Fill in the blank.) ________ is an enumeration that contains a list of all HTTP status codes.

**(Fill in the blank.)** The Angular framework provides the ___________ class for handling errors globally in an Angular application.

(Fill in the blank.) The Angular framework provides the ___________ class for handling errors globally in an Angular application.

**(Fill in the blank.)** The ________ object is the most commonly used Web API for debugging.

(Fill in the blank.) The ________ object is the most commonly used Web API for debugging.

Test your understanding of handling errors and debugging an Angular application.

Collecting User Data with Forms

Reactive Forms

Template Forms

Custom Validators

Authentication

Introduction to Angular Material

Unit Test an Angular Application

Bringing an Application to Production

Handling Errors and Application Debugging

Appendix

Conclusion