Yes, I know mouseclick happens on client side, while Hugo operates on server side. I asked just in case maybe someone knows a knowhow.
BTW I could save the index, but I could not use it to access an element using the expression
{{ (index .products $index).item }}
I suppose it needs a page update.
I wonder if someone had this experience.
As @irkode said: Hugo is not operating anywhere when a click happens. Hugo has terminated whatever it’s doing (and no, you shouldn’t use Hugo instead of a web server).
If you need a “page update”, you must run hugo and deploy your site again. If you need to modify the DOM of the page, you need JavaScript.
But as already pointed out: your questions are far too vague and general to be answered sensibly.
As everyone on this thread has advised, there is no way (known to me) to do what you want using Hugo alone. You will need three things in addition to your Hugo generated static javascript client, (1) A service-like API with put, retrieve and delete like endpoints OR a browser backed local storage with all its weaknesses and vulnerabilities (2) Some kind of persistent storage and (3) A session manager (to remove products after checkout)
I have done this (for user comments on Hugo blogs etc, not products) and I would advise you to consider other complementary strategies that might be better suited. If you still want to try, I would like to add that Hugo has excellent support for integrating and managing client-side Javascript (with the js.Build call) so make sure you have had a good look at the documentation and examples.
Hugo is exceptionally good at what it does. But what it does might not be, ideally, good for your goal.