Зачем мне лучше использовать Vue.js в проектах, чем не использовать?

Question

[Olesha17]

Добрый день [ Пишу vue.js — имею ввиду vue.js, react.js, angular.js]
К сути

1. Vue.js это прокаченная jquery или они решают разные задачи?
   
2. Если я изучу Vue.js, то могу полностью отказаться от jquery?
   
3. Что может дать Vue.js для лендинга, по сравнению с jquery?
   
4. Что может дать Vue.js для сайта до 10 страниц, по сравнению с jquery
   
5. В каком типе проектов хорошо видны преимущества Vue.js
   
6. В каких случаях вы станете используете Vue.js [не пишите во всех, пишете напр.: магаз, блок котика итп] ?
   
7. Какие бы задачи [типовые и личные] вы решали с помощью Vue.js ?
   

Цель вопроса: решить для себя изучать vue.js или нет.
Это мое первое прикосновение к js-фреймворкам, поэтому Объясняйте как пятилетнему

Comments

[Василий Назаров]

Судя по формулировке вопроса, вам ни Vue, ни прочие не нужны.
Потому как Vue для чего-то конкретного, а не "чтобы был"

Answer 1

[Антон Антон]

1. это разные вещи
2. если не завязан на компоненты, использующие jquery (хотя тот же bootstrap есть отвязанный)
3. ничего, так как в лендингах обычно немного логики, разница ощущается при росте количества связей
4. смотря что за страницы, см. выше
5. single page applications, rich internet appalications
6. когда появляется input/блок содержимое которого связано с какими-то данными, меняющимися в другом inputе/блоке
7. тысячи их. например таблица с фильтром целиком на клиенте.

Comments

[Olesha17]

У вас неплохо получилось.
Пара уточнений
1, Вы бы стали ипользовать и vue.js и jquery на одном проекте?
5. Сайты типо https://wireframe.cc/, где у меня возникает ощущение java-аплетов клиент банков, что это независимое целостное приложение?
7. фильтр таблицы хороший пример, а можете привести еще "житейские" примеры ?

[Антон Антон]

1. при первом использовании vue так и было. потом от jq отказался. Для анимаций и классов неплохо подходит https://ru.vuejs.org/v2/guide/transitions.html для ajax запросов - axios
5. банк-клиенты хороший пример, https://wireframe.cc/ - не очень
7. да все, где идет работа с данными на клиенте. деревья, всякие корзины с расчетом доставки, заполнение адреса в формате ФИАС с хранением по частям. Еще есть случай, когда отображаемые данные не равны тому, что будет отправляться на API, например отображаемый номер кредитной карты через computed свойство с пробелами и реальный без пробелов внутри данных приложения.

[Olesha17]

Антон Антон: Так, чтобы уяснить мне : если делать, допустим, функционал экселя-онлайн, то vue.js отлично подходит?

[Антон Антон]

Olesha17: без него будет сложно

[Сергей delphinpro]

Olesha17: Житейский пример - какой-нибудь калькулятор услуг со взаимосвязанными условиями.

Answer 2

[Дима Паутов]

1) jquery и vue.js совершенно разные вещи и решают они совершенно разные задачи. jquery создан для кросcбраузерной работы с DOM. Vue.js и подобные созданы для работы с данными.

2) Не факт. Для создания модальных окон, лайтбоксов, слайдеров, вам может понадобиться там и jquery, т.к. аналоги jquery плагинов не всегда есть на нативном javascript. + Готовых компонентов для vue.js не так уж и много, по сравнению с react или angular. Но их кол-во растёт

3) А что вам даёт jquery, кроме добавления нескольких плагинов? По сути, ничего такого vue вам не даст.

4) Очень многое. Разделение всего и вся на компоненты. Которые можно переиспользовать в разных частях сайта не думая о дублировании стилей, js логики и т.п.

5) Да во всех можно использовать, будь то блог или интернет магазин.

6) Если проект с нуля, то можно использовать vue.js. НО!!! Для начала, вам, его нужно изучить и достаточно хорошо!!! А так же, скооперироваться со своей командой. Дизайнерами и серверными разработчиками.

7) Лично я, пока не знаю его на достаточно хорошем уровне, но уже могу легко написать на нём блог и прикрутить node.js + express + mongodb для обработки данных на сервере. Бесконечная подгрузка постов, фильтрация данных без перезагрузки и триллион всего.

Гуглите на youtube видосы по vue.js, лично вам, на русском, что бы понять, что это такое и для чего вообще используют подобные фреймворки. Изучите хорошенько javascript иначе не сможете писать на этом фреймворке.

Я проходил курс тут. Он на английском, но достаточно понятный.

P.S. jQuery можно использовать вместе с vue.js без всяких проблем

Comments

[Olesha17]

Спасибо за развернутый ответ
Вы мне открыли глаза.
По поводу гуглите — да гуглю по 50вкладок открываю и так они и висят потом мертвым грузом

[Stalker_RED]

Olesha17: Дык надо не просто открывать, а еще и читать что там написано.

[Дима Паутов]

Pavel Ustyugov: нет!

[Klein Maximus]

Pavel Ustyugov, а почему бы еще какой-нибудь фреймворк или библиотеку не прикрутить? В итоге несколько мегабайт JS кода будут очень радовать посетителей сайта :)
Вообще, Vue может полностью заменить jQuery как по своему функционалу, так и по удобству использования.
Я от jQuery отказался совсем и не жалею.

[Klein Maximus]

Pavel Ustyugov, фриланс фрилансу - рознь. Я на фрилансе с 2009 года и до начала 2016 использовал jQuery, бутстрапы, CMS и пр., из-за чего просто приходилось штамповать всякие сайты с галереями, слайдерами и т. д.. Как Вы правильно заметили, я занимался изготовлением однотипных сайтов на конвейерной основе, которые и нужны большей части заказчиков, и за которые эти самые заказчики не хотят нормально платить, потому как денег у них нет.

И из-за этого я СОВСЕМ НЕ РОС в профессиональном плане, потому как делал все обычное, однотипное, в общем как у всех! И получал за эти заказы, как все (чуть больше или чуть меньше, не важно)!

И только отказ от использования "ширпотребных" (в смысле широкого потребления и использования, а не в том, что это полный шлак и фигня) инструментов, которые в ходу у огромного числа разработчиков (среди которых подавляющее большинство имеет потолок в виде установки плагина к WordPress) позволил мне начать расти, как специалисту, и начать зарабатывать значительно больше.

Если делаешь то же что и большинство, то тебя очень просто заменить таким же непримечательным программистом. Тем более, что низкоквалифицированных разработчиков, которые делают стандартные вещи, уже с успехом заменяют конструкторы и специализированные сервисы.

Ситуация такова, что на данный момент ниша jQuery - штампованные копеечные сайты, а вот более продвинутые инструменты (хотя изучить Vue хотя бы на среднем уровне даже проще, чем jQuery) уже позволят расти!

Все ИМХО. Спорить со мной необязательно.

[Klein Maximus]

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

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

На данный момент в проекте используется Vue2 с серверным ренедрингом, что меня очень радует, т. к. отпала необходимость сращивать фронтенд и бэкенд через PHP. Все работает через API.

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

[Klein Maximus]

Pavel Ustyugov, все таки Vue еще достаточно новый продукт, чтобы крупные заказы на нем быстро пошли. Но уже есть и заказы (на Upwork достаточно много), и вакансии (hh, мой круг). Думаю, через полгода-год их появится значительно больше. Это время можно использовать для изучения и получения опыта.

Answer 3

[Роман Александрович]

Думаю что тебе первым делом нужно хорошо знать js a дальше выбрать самому какой из фреймворков и их концепций ближе и понятнее. Я в своё время поднял на хороший уровень знание jquery и сейчас знаю но это мне не помешало изучить реакт. Есть места где до сих пор целесообразнее использовать jquery но это очень специфичные задачи. Основную часть задач скажем процентов 80 если не 90 решаю на реакте. Думаю главное преимущество всех фреймворков что ты перечислил по сравнению с jquery это скорость и концепцию компонентов. Может где то отвалиться часть приложения при этом остальная часть будет прекрасно работать что не скажешь о jquery. Концепция Компонентов так же позволяет уменьшеть дублирование кода и переиспользования компонентов.
В общем много за и мало против. В любом случае решать тебе.

Comments

[Olesha17]

Вот и спрашиваю. что не понятно какие задачи решает vue в контексте небольших сайтов.
А то ведь изучишь 800страничные книги закопаешься в него по уши, а тебе всего то и надо pop-up выводить да карусель крутить.

[Роман Александрович]

Olesha17: на vue вы можете целый сайт написать и каруселька компонент и pop up компонент и скорость разработки быстрая и сайт работает шустро. А если вы хотите просто карусульку крутить и попап показывать и сам сайт на статическом html то не стоит лезть в vue
Но как по мне сейчас jquery этот как запарожец в современном мире иномарок. Рано или поздно придётся пересесть а когда дело каждого.

[fman2]

RomReed: ну jQuery весьма неплохой вариант, когда создание сайтов поставлено на конвейер.

Answer 4

[fman2]

1) Vue.js это прокаченная jquery или они решают разные задачи?
Решают разные задачи. Jquery это быстро запилить нажатие на кнопку и отправить AJAX.

2) Если я изучу Vue.js, то могу полностью отказаться от jquery?
Для себя да, если фрилансите, то нет. Большинство сайтов на jQuery

3) Что может дать Vue.js для лендинга, по сравнению с jquery?
Да собственно ничего.

4) Что может дать Vue.js для сайта до 10 страниц, по сравнению с jquery
А для 20ти?:-)

5) В каком типе проектов хорошо видны преимущества Vue.js
Админки, онлайн-редакторы, фильтры.

6) Когда нужно очень быстро сделать админку на бутстрапе, чтобы все работало через AJAX, чтобы были компоненты и прочее.

7) Фильтр в интернет-магазине, форма оформления заказа, админка.

Comments

[Olesha17]

4. имелось ввиду небольшой статичный сайт, но, прочитав другие ответы, понял что либо vue.js не нужен там где можно обойтись без него, либо из принципа писать на нем все от hello world до фейсбука потому что можешь

[fman2]

Olesha17: ну представьте вам нужно сделать админку для интернет-магазина, где тонна фильтров, какие-то блоки повторяются, гриды, меню и так далее. Я бы конечно под это дело взял бы Ext, но если нужно быстро и красиво, то Vue + Bootstrap

[senefu]

fman2: у вас, простите, какой пунктик на админках?

[fman2]

senefu: 7, 6, 5
Если я правильно понял вопрос. Админка это частный случай SPA. Если админка хорошая конечно же.

[senefu]

fman2: вас послешать, так SPA только для админок и юзают. Учитывая возможности кодсплиттинга, SSR, SPA можно использовать вообще для чего угодно.

[fman2]

senefu: в смысле только? не кажется ли вам, что VueJS создан для упрощения программирования в тех моментах, где есть активный пользовательский ввод?

[Klein Maximus]

fman2, Vue может рендерится на сервере (под управлением Node), поэтому его можно использовать везде, а не только для активных пользовательских действий. Сама концепция компонентов очень удачная.

Answer 5

[Павел Малышев]

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

Answer 6

[unclechu]

Для начала нужно задаться вопросом: для чего вообще нужен SPA-фреймворк? Сокращённый ответ окажется краток: для декомпозиции больших сложных частей на более простые и понятные мылые (которые связываются между собой). В случае с лендингом, - едва ли вам нужен SPA ферймворк, только добавите боилерплейта (то-есть добавите сложности проекту, что противоречит изначальной цели фреймворка), да и jquery вам скорее всего тоже не нужен (разве что как обязательная зависимость для работы каких-то готовых интерактивных решений, слайдеров/галлерей).

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

В контексте сказанного попробуйте по пунктам ответить сами себе.

Answer 7

[nofuture trustnoone]

Vue.js это прокаченная jquery или они решают разные задачи?
Vue - полноценный фреймворк на паттерне MVVM, а джиквери - библиотека для вызово нужных заготовленных функций, чтобы тупо манипулировать DOM.
Если я изучу Vue.js, то могу полностью отказаться от jquery?
Можно всё, если будешь понимать как обходиться без jquery в принцпе.
Что может дать Vue.js для лендинга, по сравнению с jquery?
Интерактивность, анимации, гибкость в интерфейсе, разные веб-компоненты, которые модно вставить куда угодно и даже менять местами на ходу.
Что может дать Vue.js для сайта до 10 страниц, по сравнению с jquery
Менший вес страницы ( не нужно перезагружать), меньше отклик по переходам между страницами (vue-router), можно юзать его частично (то есть большую часть контента грузит шаблонизатор), а в асинхронные участки с интерактивом - использовать вью фреймворк.
В каком типе проектов хорошо видны преимущества Vue.js
В любом где нужен асинхрон, а аякс запросы джиквери вас задолбали. То есть по большей части - работа с данными. Если вам нужно динамично построить дерево комментов по данным, то vue это лучше сделает.
В каких случаях вы станете используете Vue.js [не пишите во всех, пишете напр.: магаз, блок котика итп] ?
Уже можно нативные приложения писать, по тому частично мобайл приложения, в проектах где нужны компоненты которые на Vue легче сделать, чем накостылять на джиквери.
Какие бы задачи [типовые и личные] вы решали с помощью Vue.js ?
Анимированные переходы между блоками, интерактивность, асинхронные вызовы и построение графиков, infinity scroll page

Цель вопроса: решить для себя изучать vue.js или нет.
Для работы на дядю - учить ангуляр\реакт, но смотрю комьюнити у Vue более лояльное и может работа тоже появится.
Это мое первое прикосновение к js-фреймворкам, поэтому Объясняйте как пятилетнему

Comments

[h8nor]

смотрю комьюнити у Vue более лояльное и может работа тоже появится.

Answer 8

[Кирилл Таран]

1) И Vue и jquery это все прокачанный JavaScript, просто Vue более прокачанный и соответствует текущему времени и современному подходу в разработке
2) Скорее всего да, более того используя Vue тянуть туда jQuery является моветоном и плохой практикой. Есть исключения о которых ниже.
3) Это и есть исключение. Единственное где бы я использовал до сих пор jQuery, был бы самый простой лендинг. Хотя кого я обманываю в 2018 году я бы и обычный лендос лучше бы уже писал на чистом/ванильном JS.
4) Компоненты, привязку данных к view(не путать с Vue), удобный роутинг, возможность использовать единое хранилище и тд.
5) Во всех проектах размер которых больше лендинга.
6) Во всех проектах размер которых больше лендинга.
7) Во всех проектах размер которых больше лендинга. Пет-проект - SPA, рабочий проект - большое SPA.