The Importance of Data Transfer Objects in Web Development

Kacper Bąk
3 min readMar 19, 2023
Photo by Lee Campbell on Unsplash

When working with web applications, it is common to encounter data associated with a user in multiple places. This is not a big problem for smaller applications, but for larger applications, it can lead to errors if updates are missed in certain areas. Additionally, separation between front-end and back-end development can lead to dependencies that may come as a surprise, such as differences in API responses, API requests, data types, and data structures.

One way to address this issue is through the use of Data Transfer Objects (DTOs), a pattern frequently used in back-end development but also applicable in TypeScript for consuming RESTful APIs. DTOs serve to transfer data between different layers of an application.

The main role of DTOs is to separate the data used for transfer from the data contained in the model itself. Front-end applications require user data, which may be provided in a slightly different format on the back end. DTOs act as intermediaries between the two layers, ensuring that the type of user remains unchanged despite any differences between the front-end and back-end formats. DTOs only contain fields that store data.

To utilize DTOs, a mapping function must be created to transform the data coming from the application. This function acts as a translator of sorts, taking the DTO user object received from the API and transforming it into the format necessary for the application layer.

If changes are made to the API, only the DTO and the mapping function need to be updated. All other parts of the code can remain untouched. This makes DTOs an efficient way to separate the application layer and ensure compatibility with future API updates.

One potential issue with separate front-end and back-end development is compatibility between old and new API versions. This can be addressed by creating two DTOs that reflect the structure of both versions of the API. The mapping function contains the logic necessary to accommodate both API versions. By returning only the data needed by the presentation layer using a TypeGuard, this approach ensures that the code is properly refactored if an old API version is discontinued.

DTOs are an important component of Domain Driven Design, a method of designing and developing applications that focuses on business logic, domains, and subdomains. By beginning with the creation of domain types, developers can ensure a solid foundation for their application that is not reliant on technicalities. DTOs can then be used to separate business types from API types, allowing developers to focus solely on the former.

In summary, the advantages of DTOs are mainly related to separating the application layer. By using DTOs, developers can avoid errors caused by missed updates and ensure compatibility with future API versions. By focusing on business logic and utilizing DTOs, developers can create a robust and reliable application that is built on a solid foundation.