How should layout be organized?

Question

css

Hello!
In almost all training materials, the layout is divided into three parts: one html, one css (or one preprocessor file) plus a js file. At the same time, as I understand it, even relatively small landing pages need to be divided into modules and assembled from index. Plus, each module has its own css, plus a separate one with fonts and variables. And all this is collected through webpack or some other bundler.
And another important point: how, in this case, to make up for the mobile version? Any separate file for the whole site?
So what should be the structure of a full-fledged sellable layout? How and when is it necessary to break the layout into pieces?

Answer 1

And so, usually when developing sites, there are two versions (this is an example like mine) the development folder in it is divided into separate ones (css (less) / html / js / pictures), etc.
What do you mean where? fonts - fonts, less (all less files are divided into pages / modules), img (logical - pictures, well, there are broken inside - icons, backgrounds, ordinary pictures, etc.) js (there are all scripts by files), well and moduls (repetitive html blocks ala header/footer/aside are broken, which I just connect in the place I need)
This is all a folder, purely for me for development.
There, in fact, all js is already assembled into one main.js / css file in main.css, compressed pictures, code comments are removed, well,
etc. , what will be shared. Usually I transfer both versions (production - well, it’s logical, and the second one in case they add functionality / edit, well, etc.)
Well, now the answer is how to arrange all this correctly?
No one will give you an exact answer here - except for general recommendations - since the breakdown, etc. carried out, purely for the convenience of the developer (how it will be more convenient for you to work.)
PS As for the mobile version, well, it’s quite logical to make a media file (well, or any other name)
And just write media queries to it - also quite logical)