How to properly assemble a project from a bunch of html, css, js files?

Question

JavaScript

Friends, please, tell me how to assemble the project correctly. Of course, I understand that when they see such a text, many will stupidly close it, since it takes a very long time to read. But I hope someone will answer.
I make a website using html, scss, js. And I guess I'm doing it wrong, that is, I write in pieces, for example header.html, header. scss, menu.html, menu.scss, etc. Let's create
an index.html file and use php include to insert pieces of html files there. And something tells me why use php, if you can shove imports into the head by resorting only to js. Or is it normal? But again, I want your opinion on this.
But the most unpleasant thing is to glue scss. That is, I create style.scss again and add pieces of scss files to this file using import. But even there a lot of trouble awaits me. To use variables, you have to paste a file with variables into each scss. And there are terrible things happening. If you change some value in a file with variables, then in order for the changes to spread to all files, you need to resave each file separately. In general, horror.
But even if I put up with it, then I face the most important problem, all these pieces of header.html, footer.html, etc., they begin to be indexed by search engines, for some reason, you yourself understand, pages in Yandex appear such as https://domain/header.html.How to fix it? Disable in robots.txt? Will this affect the seo of the main pages consisting of chunks?
Well, the last question, I know that they are now making one index.html file and then using js or php, for example, they simply insert files in pieces when clicking on a certain link, for example. It turns out that in fact there is only one main page and it dynamically changes depending on the user's navigation. Is this a good approach in terms of SEO?
Thank you!

Answer 1

1. Do not suffer and use a framework. Yii2/Laravel/Symphony etc.
2. For static use Webpack and build with it.