A robust application is defined not by how it works in perfect conditions, but by how it recovers when things go wrong.
1The catchError Pattern
The catchError operator is your primary line of defense. By piping your HTTP request through it, you create a recovery strategy. This strategy can log the error to a monitoring service, transform the raw technical error into a user-friendly message, or even provide default data to keep the UI functioning. Crucially, catchError must return a new Observable—usually created via throwError—to correctly propagate the failure state to the final subscriber.
2Diagnosing the Failure
Not all errors are created equal. Angular provides the HttpErrorResponse object to help you differentiate. A status code of 0 typically indicates a client-side or network error (like being offline), while status codes like 404 or 500 indicate that the backend was reached but couldn't fulfill the request. Understanding this distinction is vital for providing accurate feedback to the user—for example, telling them to 'check their connection' versus 'contact support'.
