Error handling in SPA applications

Error handling is often an afterthought, something that is implemented late in the development cycle, sometimes even when the application is already running in production. But including error handling early in the design stage has many benefits. It makes development, testing and debugging easier, it also helps create a better user experience.

In a typical single page application, errors can be divided into ones that occur on the server side, in the API layer, and those occuring on the client side, in the front-end application. Of course they are connected and must be handled in a consistent way. Let’s start with the API.

Server side errors

Let’s suppose that we are building a REST API with Node.js and Express (though similar rules apply to other technologies).

There are three general categories of errors that can occur:

• Fatal errors. These errors indicate that the request cannot be performed, even though it is valid. This usually means that some resource is not available (for example, the server cannot connect to the database) or that the programmer made a mistake (for example, there is an syntax error in an SQL query or a runtime error in JavaScript code).
• Request errors. These errors occur when the client sends an invalid request, so the server cannot interpret it correctly. Examples are invalid URL, missing parameters or wrong type of parameters. This usually means that the programmer made a mistake in the client code that sends the request to the server. Authentication and authorization errors also fall into this category.
• Logic errors. This is probably the least obvious category of errors. It means that the client sent a valid request, but the operation cannot be performed because of some application logic constraints. An example is a request for the details of a user with ID=4, when such user doesn’t exist in the database. It is not a request error, because 4 is a perfectly valid value for a user ID, in fact a user with this ID could have existed a while ago. Also it’s not a fatal error, because the database is available and the query was executed correctly, it simply didn’t return any results. Another example is trying to add a user with the same email as an already existing user. The request…