Angular Global Error Handling

Slide 1

Slide 1 text

Dhananjay Kumar Founder, Nomad | ng-India Angular Global Error Handling

Slide 2

Slide 2 text

I wish undefined was a function

Slide 3

Slide 3 text

Types of Error @debug_mode Compile time Error Error in Template Run time Error HTTP Errors

Slide 4

Slide 4 text

Run time Error

Slide 5

Slide 5 text

Run time Error

Slide 6

Slide 6 text

What if a developer forgets to try-catch

Slide 7

Slide 7 text

Why Global Error Handling • Set up custom error handling. • Send error logs to the server. • Redirect to an error page when necessary. • Conduct an error analysis for the application. • Integrate Azure App Insight, Amazon CloudWatch, etc.

Slide 8

Slide 8 text

Step 1 Create a Service

Slide 9

Slide 9 text

Step 2 Implement ErrorHandler classclass Step 2

Slide 10

Slide 10 text

Step 3 Implement handleError method

Slide 11

Slide 11 text

Step 2 Provide the service in app.configclass Step 4

Slide 12

Slide 12 text

Run time Error

Slide 13

Slide 13 text

To log the stack trace, install stacktrace-js library in project, Step 5 > npm install stacktrace-js

Slide 14

Slide 14 text

Step 6 Use stacktrace

Slide 15

Slide 15 text

Run time Error

Slide 16

Slide 16 text

Log @debug_mode Stacktrace Route Logged In User Date Time

Slide 17

Slide 17 text

Log • Create an interface • Develop a service to send logs to the server via API. • Integrate the service within the GlobalErrorHandler to log errors and trace details.

Slide 18

Slide 18 text

No content

Slide 19

Slide 19 text

Dhananjay Kumar Connect me for Training and Consulting. Email – [email protected] @debug_mode