Где грань между версткой и front-end?

Question

[Артём]

Доброго дня!
Интересует мнение практиков по поводу уместного использования инструментов типа react, vue и т.д.
Где та грань между выбором в пользу чистой верстки и front-end либы?
Практиковал верстку на примере макета с результатом. И тут имхо понятно что фронт-енд либы - оверхед.
Но например нашел на просторах макетик тоже для практики.
Если подходить к вопросу со стороны покачать скилл - сборочка на webpack, ванильный js, scss и погнал. Но с другой стороны есть повторяющиеся элементы, те же слайдеры от блока к блоку - можно было бы в react-овский HOC засунуть логику слайдера (это что касается второго макета). Да и вообще после работы с реактом начал лучше смотреть и видеть макет как набор компонентов, которые можно переиспользовать, как в плане логики, так и в плане UI.
Мыслить о проекте компонентами удобно и просто.
И в принципе с create-react-app или аналогом от vue было бы удобнее работать чем со сборкой на webpack потому что компоненты, импорты, отложенная загрузка простой и понятный синтаксис, DRY, поддержка от редакторов/IDE, скоуп для стилей.(конечно часть этого добра можно добавить и в webpack сборку, накинув например pug для "компонентности", импортов, но лично мне синтаксис его не нравится).
Но оправдана ли мощь таких инструментов в данном случае, ведь в сборку добавится еще исходники этих либ, что увеличит размер приложения и добавит 100% зависимость работы сайта от js?
Где грань, когда можно/нужно обойтись нативными средствами что бы меньше зависеть от либы/фреймворка/js и когда необходимо использовать front-end либы?

Answer 1

[Антон Спирин]

Где грань, когда можно/нужно обойтись нативными средствами что бы меньше зависеть от либы/фреймворка/js и когда необходимо использовать front-end либы?

Когда от верстания макетов перейдете к реальным задачам, вроде реализации какого-нибудь сервиса(социальная сеть, личный кабинет банка, сервис бронирования, служба доставки с личным кабинетом, видео конференции и тп), тогда и поймете.

Для верстки лендосов тянуть фронтенд фреймворки нет особого смысла.
Второй макет можно реализовать на React/Vue как красивое одностраничное приложение с клиентским роутингом. Там и бронирование отеля и магазин. Думайте не о верстке, а о том как такие вещи как бронирование и магазин реализовывать будете. Тогда может и придет понимание зачем во фронтенд разработке используют фреймворки и где та самая грань.

Но с другой стороны есть повторяющиеся элементы, те же слайдеры от блока к блоку - можно было бы в react-овский HOC засунуть логику слайдера (это что касается второго макета).

HOC используют не для этого.

И в принципе с create-react-app или аналогом от vue было бы удобнее работать чем со сборкой на webpack

Пока верстаете макеты и не работали в реальных проектах может быть и удобней. И да, create-react-app и аналог от Vue под капотом используют webpack.