[SalesForce] How to specify the difference between client controller vs server controller action in Lightning

I ran into an issue where my code was stuck in a loop, because I was calling this from a controller action: onclick="{!c.saveAccount}".

This in turned called a client-side controller action:

saveAccount: function(component, event, helper) {
    // ...
    var action = component.get("c.saveAccount");
    // ...
    $A.enqueueAction(action); 
}

On the server-side, there's a controller action, saveAccount(Account). What ended up happening is my client-side controller action kept calling itself, because I assume component.get("c.saveAccount") is a reference to the client side controller action, and not the server-side controller action.

The way I stopped it was create a saveAccount helper method, and rename the client-side controller action to handleSaveAccount.

So, am I correct in assume that both client-side and server-side controller actions have to be unambiguous? That is, I cannot have a client-side and server-side controller action with the same name?

Are there any established best practices or patterns to ensure a clear differentiation between client-side and server-side controller actions?

Best Answer

Client side and server side controller method name should not be the same its documented here

Use unique names for client-side and server-side actions in a component. A JavaScript function (client-side action) with the same name as an Apex method (server-side action ) can lead to hard-to-debug issues. In debug mode, the framework logs a browser console warning about the clashing client-side and server-side action names.

Regarding naming convention, we keep the client side controller and helper method same in lightning component bundle and for apex methods we start with 'callTo' + functional purpose : 'getlstaccounts' or 'updateProfile' to follow a consistent naming pattern.