Зачем верстают сайты на js фреймворке(Vue/React/Angular)?

Question

[Vladislav]

Всём доброго времени суток, зачем верстают сайты на js фреймворке(Vue/React/Angular), если можно верстать на чистом html5, каком либо препроцессоре, js/jquery . Я говорю чисто про вёрстку компонентов, а не про сложную логику фронта

Comments

[Roman K]

Так верстай, кто мешает

[Vladislav]

Roman Kitaev, я не совета спросил на чем верстать, а мнение из собственной практики, а ты внимательнее вопрос читай

[WapSter]

Сложное делать проще. Но раз ты об этом спрашиваешь, верстай пока на как умеешь) Хотя тут термин верстка вообще не уместен, всего лишь часть разработки.

[Алекс Глебов]

для практики, если там не нужен фреимворк по сложности.

но если проект будет на фреимворке, то делать верстку на чистом html, а потом разбивать на компонеты - это двойная работа.

[Владимир Коротенко]

Например знают что верстка будет на этом фреймворке, и что бы потом не перевёрстывать, забивают стабы, моки, просто хардкодят. Это банально удобно, дороже и исключает тупой кодемонкинг позже

[Владимир Коротенко]

Вот вам пример. Страница входа, блок под ним ссылки логин регистрация восстановление. Общие элементы мыло, пароль, блок социальных сетей. И ради этого создавать 3 страницы?

[Maksios]

Для удобства и скорости

Answer 1

[DevMan]

эмм... что означает верстка на js?
например, я использую Vue. да, верстка размещена в компонентах, но это совершенно обычная html-верстка.

Comments

[Vladislav]

DevMan ты сколько учил Vue.js и по какой программе? Где практику брал?

[WapSter]

Vladislav, зачем его учить? зная js просто читай доки как и с bootstrap или jquery.

[DevMan]

Vladislav, учил примерно день - чтение доки.
затем по мере практики прост гуглил непонятные мне моменты.

[Vladislav]

WapSter, у каждого свой подход к изучению новый технологии

[Vladislav]

DevMan, понятно, также у меня с jquery когда то было, но сейчас я jquery знаю хорошо, хотя фреймворк js и библиотека js рядом не стояли

[Владимир Коротенко]

Vladislav, класная заявка, назови хотябы 2 штуки которые реализовать очень сложно на ванильном яваскоипте

[DevMan]

Владимир Коротенко, назовите хотябы 2 штуки, которые реализовать очень сложно на ванильном языке Х и легко на фреймворке для него.
фреймворки кагбе создаются не потому что сложно.

да и само понятие сложности - индивидуально для каждого.

[Владимир Коротенко]

DevMan, для меня сложно вычислить размеры вложенного элемента, и да анимация тот ещё квест

[DevMan]

Владимир Коротенко, тем не менее, они реализуются ванильным js.
фреймворки - не про сложность, они наоборот для упрощения и унификации.

[Владимир Коротенко]

DevMan, я в общем то и не спорю. Джиквайри прошёл долгую дорогу, и сейчас от его плюсов остаётся очень мало. Я в очередной раз перетряхивал код сайта и решил что 90 килобайт как то много, переписал все на чистом js вышло даже короче

[DevMan]

Владимир Коротенко, 90 kB по сегодняшним меркам - это ничто. особенно, если пользовать популярные cdn.

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

это касательно jq, которая рулила десять лет назад. а с современными реактами/ангулярами/вью/etc всё уже сложнее - у них другая сфера применения.

[Владимир Коротенко]

DevMan, Я говорю именно за JQ и когда сливаешь старый проект и новый. Вот тут думаешь а вот эта фигня тебе реально нужна?

[DevMan]

Владимир Коротенко, зависит от как и насколько она применялась.
в одних случаях стоит переписать, в других стоит оставить.
универсальных решений не существует.

[Константин Ишеков]

Vladislav, я начал переписывать сайт с jquery на vue в августе. К декабрю уже закончил. При этом никогда не имел дело с ним. Сайт сложный в плане архитектуры(интернет магазин). Очень хорошо помогала офф документация. Да и Гугл выручал)

Answer 2

[Сергей Чамкин]

Очень удобная организация кода. Разработка заметно упрощается, отделяем фронт и бэк.

Также отсюда

1) намного проще разрабатывать и поддерживать пользовательские интерфейсы, где не нужно делать обновление всей страницы на любое действие.
2) На сервере вы работаете только с данными и не генерируете разметку, что положительно сказывается на производительности сервера.

Answer 3

[McBernar]

Ну, наверное, потому что это компоненты из коробки и удобная работа с js.

Answer 4

[Павел Атайкин]

Привет! Обычные сайты обычно не верстают с помощью js фреймворков.
Vue/React/Angular используют для написания веб приложений.
Архитектура в общем виде такая
1) Backend
2) Frontend
3) API
Где backend и fronend можно представить в виде двух островов, а API мост между ними.
Для чего это нужно. Такой подход позволяет делать front & back независимо друг от друга(у них есть чёткая спецификация API)
Так же в такой модели сервер менее нагружен т.к. ему требуется отдавать только текстовые ответы(JSON), а не рендерить целиком HTML.
Ещё одно преимущество это более удобной контроль над frontend'ом. Потому что именно он здесь решает, что и как будет работать и какие запросы нужно сделать на данный момент, а какие можно и позже загрузить.
Проще писать сервер, потому что ему не нужно никакие данные о пользователе, ему всё необходимое приходит в запросе.
P.S. Если всё ещё не понятно, для чего используют Vue/React/Angular задай вопрос в комментарии

Comments

[DevMan]

верстка на js - вообще нонсенс.
и ничего не мешает выводить страницу сервером и рендерить (не путать с вёрсткой) часть этой страницы при помощи js.

[Павел Атайкин]

DevMan, Я не понял суть вашего комментария, опишите, пожалуйста, подробнее, что вы имеете ввиду

[DevMan]

Павел Атайкин, именно то, что и написал - верстка есть только на хтмл.
куда ты этот хтмл воткнешь: напрямую в файл или в js-компонент - не роялит, от слова совсем.

[Павел Атайкин]

DevMan, Если бы было так, не появились бы эти самые фреймворки :) js компонент это совокупность: HTML, CSS, JS. И в модели Vue/React/Angular это не просто кусок html по спецификации. Там ты создаёшь свои элементы(делаешь конструктор/лего), которые создают контекст системы и строят архитектуру приложения. То что в итоге это всё превращается в html не тоже самое, что разницы нет.

[DevMan]

Павел Атайкин, не превращается, а и есть тот же самый html.
то, что им можно динамически управлять - это вообще про другое.

Answer 5

[Максим Пак]

На React/Vue/Angular разрабатывают Single Page Application.
И к верстке они ни какого отношения не имеют.
Возможно ты перепутал со сборщиками Gulp/Webpack, которые позволяют ускорить процесс разработки.
Да и еще, не нужно под каждый чих или пых юзать сборщики, времени больше затратить.

Comments

[Vladislav]

Максим Пак не только spa пишут на них

[Максим Пак]

Vladislav, Написал бы, что еще на них разрабатывают.
Не все же умные, как ты и знают, что так же разрабатывают PWA и Mobile App.
Но зачем же это писать, тема вопроса другая же, а тебе просто засветиться захотелось.
Хочешь блеснуть знаниями, пиши развернутые комментарии, а не в лужу бзди.

[Vladislav]

Максим Пак, мне интересно мнение других разработчиков, ты чего бомбишь то? :)

[Максим Пак]

Vladislav, А, так ты же автор :) А я думал, какой-то выскачка решил по умничать :)