When it is usefull to create model of data from backend in angular application?

Viewed 1513

I am still learning an Angular, but also I have an opportunity to participate in a large application with Angular 5 on frontend and java in backend.

The question is about creating models in angular application. Java developers are trying to convince me, that creating the same model structure as they have on backend will give me more benefits than just having auto-suggestion in IDE when refering to it in HTML template.

Unfortunately I don't see much of benefits or at least as much to return the time of work I have to spent generating all models to any response from backend.

Let's say I have API which returns me something like this:

{ email: "test", firstName: "test" lastName: "test" uuid: 2 }

Now I should create a model for this which could look like this:

export class User {
    email: string;
    fisrtName: string;
    lastName: string;
    uuid: number;
}

What is the point of doing this ? what are benefits of such approach ? Moreover, the same data structure which is called an entity on backend already exists, so why should I create the same code on frontend ?

Instead of working with received data right away, I have to create a model for each response including creating another file for each model and then work with them.

I have heart that it is done because Angular uses Typescript, and eveything should "typed", but this argument neither convince me, because I stil don't see any benefits of using them.

The down sides are creating extra logic, more files and duplicate code which already exists on backend.

Perhaps it is because of not understanding the dynamic nature of frontend and different abstraction ?

Backend has to manage abstration via entities, while frontend manage views, present data which are ready and should be prepeared from backend. This is why i think backend for sure should mantain proper entities creating models, but why should frontend do the same, when we are managing different abstraction ?

I read this article about handling models in Angular https://nehalist.io/working-with-models-in-angular/ But author mentioned only about two reasons why do this.

1) First one is about changing something in template to display it in a different way. I don't see a benefit here because even if I will create a method like "fullName()", then if customer says that he/she wants now to have only "firstName", then the same work has to be done to change it in all templates.

2) Second one is about being "typed" everywhere, I don't see any good reason why I should be "typed" in everything I do, this is not Java, C++ or any other low level language. Also we maintain view basing on already prepared data.

I hope I explained my problem clearly and thank you in advance for any explanation.

2 Answers

Typings are all about convenience and TypeScript was brought into being for a reason.

Amongst other things typings make it easy for your IDE to provide you with IntelliSense and prevent you from mistyping field names while you are developing. They also make it easier for you and others to understand what kind of information is being passed around in your application and define rules for your data flow.

How often do your backend types change? If not that often, and if you are not working with dynamic data, then I would take the time to implement a simple interface (it does not have to be a class) to get the most out of what TypeScript has to offer.

You can use for example swagger codegen to generate Java and the Typenscript model objects from the same swagger configuration. If someone changes the model you get a nice compile error instead of nasty runtime error, which might not is noticed at all.

Even if the model is written and updated by hand you get compile errors and not runtime errors and a failing build if you forget something. Or a coworker on a different branch is not aware of the model changes and merges his changes into the master branch. It's better to get a compile error in these cases

Related