Я джун фронтендер, пока нигде не работал, заказы не выполнял, только для себя, опыт нулевой.
Заканчиваю писать
свою webpack сборку, хочу поддержку компонентов, но не получается у меня организовать шаблоны. Решил придерживаться BEM методологии, прочитал часть документации, дошёл до html, они там суют свой bem-xjst, я не хочу использовать такие узконаправленные инструменты, плюс фиг это интегрируешь с webpack (документации никакой нет, делай что хочешь), нужно что-то попроще. Посмотрите пожалуйста структуру проекта, как реализовать шаблоны? Я знаю что есть компонентный подход в Vue и React, но мне наверное стоит сначала получше изучить основы, нельзя реализовать компоненты без каких-либо таких тяжелых библиотек/фреймворков? То есть как я понял, мне нужно чтоб у меня шаблоны рендерились на сервере(во время сборки), а не в браузере у клиента. Какими инструментами это сделать, как это устроено на крупных проектах?
Пробовал handlebars, но нормально подружить его webpack и BEM у меня так и не получилось, какая-то дурная связка.. Так-же знаю, что есть pug, но лично мне кажется, что это инструмент для извращенцев, мне не нравится синтаксис. Как я понял - это препроцессор, но мне они не нравятся, я пишу на ванили, перешёл недавно с SCSS на CSS. Как быть в таких случаях? Я встал в тупик. Можно конечно писать html вручную, но это гораздо труднее поддерживать, на многостраничниках тем более, если захочу поменять разметку одного компонента, придётся везде его искать и заменять, это жутко неудобно.
Или в принципе вариантов нет, и если я хочу полноценную компонентность, мне стоит идти учить фреймворки?
Я рассчитываю на полное разделение на компоненты: от header'а до кнопочек.
