How to properly build a modular project structure?

Question

JavaScript

Hello. Now I'm doing a project in js, BEM layout, and therefore I've been in an absolute stupor for two days.
The problem is with js modules. From the BEM documentation, I realized that we should describe the behavior of the block / element directly inside the entity folder along with its CSS. But if the js module is not directly related to a specific BEM entity? For example, there is a project with the game 'monopoly'. The 'Play' button parses information about the players from the menu (how many players the user has selected, what figures they have, etc.) and writes them to the object. A strong desire to define the code with the object (and methods for working with it) in a separate module, since in the future this object can be used in many places. But where to throw it? To a global folder next to index.js? What if there is a lot of such code? The global folder will simply become clogged.
I will accept any help. If, in addition to explanations, you send links to articles or even to your (preferably simple) project with a modular structure, I will be very grateful

Answer 1

I didn’t understand what was happening with BEM.
The Play button does not parse anything. There is a components folder. There is a button folder in the components folder. It contains the component and style code for the Button. The button can accept different configuration parameters such as text, icons, colors, shapes, sizes... In short, all button variations that you need to implement. And the button accepts as one of the parameters the click handling function that it calls when clicked and which the event object passes. Maybe something else. You know better.
Next, you have a component that is responsible for rendering some page. For example, you have several main sections on the site. For each creates a folder, and inside the components of pages and subpages. If the site hierarchy is not deep and not large, you can repeat the site structure with the folder structure.
In the component of your page, you import all the necessary components, including the Button, which declares the methods that make this page come alive. One of the methods is a button click handler. Pass the required parameters to the Button component, including title="Play" and a click handling function.
If there are some services that are used in many places or a helper function, then they can be placed, for example, in the common/services or common/helpers folder.
Oh, I wrote as if it were a react project, I just noticed that the question is about the node. But the modern backend does not compile html, but only sends the corresponding data in the form of json to certain endpoints. And the markup is completely on the side of the frontend.