Duplicate logic in backend and frontend with Domain Driven Design

Question

I have a class with some calculation login in backend:

public class MyDomainClass{
    private Double amount;
    private Double total;
    public Double getPercentage(){
        /*business logic*/
    }
}

My frontend is in angular 2+ and I want to show this information in 2 ways.

In a table with a list of them provided by the server:

And in a edition form, with the percentage calculation based on user input:

To make this calculation in the form I have to duplicate the logic in a frontend domain class too? I'm afraid to duplicate business logic and lost control of the code with more complex problems with this same idea (Some logic in backend for reports and list and the same logic in frontend forms).

How can I avoid that?

P.S: I use Jax-rs in the backend.

Answer 1

You need to be pragmatic about these things. Front-ends need to ensure that the user experience is acceptable at the very least and at times there may be duplication of functionality to keep the UX smooth and reasonable.

Another example may be validations. Front-end validation is necessary even if your domain has to perform those same validations. The domain is the source of truth and all invariants have to be implemented there. Duplicating certain bits of functionality, within reason, on the front-end is acceptable if it improves the user experience.

Simple calculations, as the one you have used as an example, is something that I wouldn't even worry about. The same with adding up costs to display totals and the like. Your domain may be doing the same but the intent is different.

If there is any "heavy lifting" to be done then rather make a call to your web-api and have your back-end handle that.