Global Error Handling and Logging (Production Ready)
Capture errors globally, report them to logging tools, and avoid silent failures in production.
In production apps, you want visibility: - which errors happened - how often - on which page - which browser Angular allows a global error handler. ## Example: custom ErrorHandler ```ts import { ErrorHandler, Injectable } from '@angular/core'; @Injectable() export class GlobalErrorHandler implements ErrorHandler { handleError(error: any) { console.error('Global error:', error); // Example: send to logging API // fetch('/api/log', { method: 'POST', body: JSON.stringify({ error }) }); } } ``` ## Provide it ```ts bootstrapApplication(AppComponent, { providers: [ { provide: ErrorHandler, useClass: GlobalErrorHandler }, ], }); ``` ## Best practice - log errors with context (route, user id if safe, timestamp) - avoid logging sensitive data - show user-friendly fallback UI instead of raw error messages > Next: Guards vs resolvers vs interceptors, when to use which (architecture clarity).