Comments 46
За Vue.js никто не стоит? А разве Alibaba не является фактически владельцем? я не против, я за то чтобы большие компании поддерживали хороший продукт.
Еще интересно сравнение, с ReactJS, чем обоснован график, где пример кода, используется ли оптимизация в ReactJS (PureComponent к примеру)?
… без необходимости шаманить с системой сборки

В любом приложении, которое состоит не из 5 кнопок и 2 инпутов, без систем сборки/таскраннеров не обойтись.

Верно, но это только для релиза. А вот при разработке сборки и таскраннеры только мешают.

Это так, но зато Vue можно постепенно внедрять в legacy-код, просто подключив на странице и создав экземпляр Vue

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

Почему? Экосистема Полимера выглядит куда взрослее. Хотя, конечно, на вкус и цвет… Главное использовать нативные веб-компоненты под капотом, ибо они сами по себе открывают много возможностей.

Пробовал 9 месяцев назад полимер.
На FF более менее среднее приложение тормозит безбожно — открывалось до 10 секунд.
В хроме проблем не было

С тех пор уже вышла новая версия спецификаций веб-компонентов (v1), и Polymer 2.0. Очень советую посмотреть на ютубе секции про компоненты и Полимер с последнего Google I/O.

Спасибо за статью. Vue действительно замечательный фреймворк, глоток свежего воздуха.
Сам стоял перед выборов vue или react. Vue подкупил легкостью в изучение, более читаемые шаблоны на фоне jsx, хотя при большой вложенности компонентов читать сложно. Но вот ни как не могу понять, какую лучше структуру проекта применять при использование vuex. Обычно все стремятся распихать мутации в один файл, экшены в другие, а если еще и на модули разбито, становится сложно ориентироваться по папкам и в куче открытых вкладок ide.
Обычно в одну папку собираю компонент (или несколько компонентов), отвечающий за определенную фичу и туда же кидаю файл vuex-модуля для этой фичи. А эти модули уже подключаю в рутовый файл vuex.
А почему Ember не рассматривали? Бегло по статье пробежался, очень похоже…
Как по мне, у Ember гораздо более высокий порог вхождения и необходимость четко следовать определенным правилам. У Vue же больше свободы, но как минус — архитектуру приходится полностью продумывать самому.

Очень удобная библиотека для использования бустрапа вместе с vue js
https://github.com/bootstrap-vue/bootstrap-vue


Я вкурил Vue, после него сомневаюсь что будет, что-то лучше!
Кривая обучения у vue проще паренный репы.

Отличная статья. Я уже начинал погружение во Vue и мне он очень понравился. Но из-за недостатка свободного времени пришлось пока отложить его. Поэтому читать статью и снова вспоминать как это красиво реализовано было приятно.
Хотелось бы еще более подробное описание про Vuex, так как без него врядли можно сделать серьезное приложение.

Мы используем Vue 1.0 в X-Cart 5 и впечатление от использования отличное, годные доки и прочее.
Самостоятельно реализовали возможность перерендерить компонент темплейтом и значениями из любого промиса, в т.ч. ajax-запроса. К сожалению, авторы во второй версии решили выпилить form input как источник изначальных значений и это нам сильно обламывает переход на нее.


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

Использую Ractive, с которого Vue и «слизывали». Там из коробки есть такая штука как адапторы (adaptors), с их помощью можно легко зареактивить объект любого типа. Поэтому я делаю так:
ractive.set('products', api.get('products'));

И никаких запар. А относительно недавно стал вместо «голых» промисов работать с Rx, там с управлением потока данных поинтереснее вещи можно делать и также автоматом реактивить в Ractive инстансы.

Спасибо за статью. Стоит отметить, что авторы vue-resource как-то писали, что теперь эта библиотека более не является частью "официальной рекомендации" Vue и советовали смотреть в сторону других библиотек (например, Axios)

Меня вот смущают .vue однойфайловые компоненты. Это ведь нужна поддержка от ide для удобной разработки. Как ide определит, на чем вы пишете логику, на typescript-e или javascript-e, или мы используем sass, post-css. Кто сталкивался, подскажите. А желательно с примером кода на гитхаб. Спасибо.

Указываете lang в style и всех дел.
Документация


These specific languages are just examples. You could just as easily use Bublé, TypeScript, SCSS, PostCSS — or whatever other preprocessors that help you be productive. If using Webpack with vue-loader, it also has first-class support for CSS Modules.
lang можно указать для всех трёх элементов vue-файла. Если поставить шаблон webpack через vue-cli, то нужно только доставить соответствующие пакеты и всё будет работать (документация по шаблону). Сам использовал pug(jage) и stylus.

Например, для Sublime Text есть Vue Syntax Highlight, который нормально подсвечивает vue-файлы и подхватывает нужную подсветку из lang.

Ничего не мешает .vue файл использовать просто для группировки, а сами файлы (шаблон, код, стили) внутри подключючить как внешние файлы.

UFO landed and left these words here
Интересует будущее Vue, где можно почитать о планах? За последние годы я переел этих тайпскриптов, флоу, вебпаков и *-cli. Сейчас в отпуске свой пет проект начал писать на первом angular, без всяких обвесок и вдруг вспомнил, что люблю программирование.
Vue выглядит как неплохая альтернатива angular1, да и схожесть упрощает освоение, но она же пугает, как бы авторы не пошли по тому же пути c предпроцессорами, типизацией и функциональщиной.

Спасибо за статью! Очередной раз убеждаюсь что я сделал правильный выбор) и смотрю в комментариях большинство очень положительно относиться к Vue.


Сам выбирал между вью и ангуляр, и вью показался таким простым и каким-то уютными)


Есть те кто уже довольно опытные люди в последних версиях вью и ангуляр чтобы дать своё сравнение? У меня к сожалению не очень большой опыт работы с обоими фреймворками.

и каким-то уютными)

Потому что это так и есть, это очень developers friendly штука, забыл например описать поле в data — фреймворк тебе подскажет не тупи мол.

Если бы он это ещё на этапе написания кода подсказывал или на этапе компиляции, а не в рантайме и то, когда исполнение дойдёт до нужного участка кода, если дойдёт.

Не надо пытаться найти идеальный инструмент. Каждый решает определенные задачи, а Angular 4 и vue.js вещи не сравнимые.
Я и не ищу идеальный инструмент, мне хочется понять для каких именно задач каждый из инструментов. Вы случаем не могли бы прокомментировать этот момент?
Вуй подходит для мелких приложений, ангуляр для крупных серьезных проектов.
Статья хорошая, спасибо! По поводу Vue, написал на нем 2 проекта и честно говоря ожидал большего. По существу это своеобразный подражатель Ractive, с определенными и, лично на мой взгляд, не совсем удачными заимствованиями из других фреймверков.

Конечно, на фоне остальных хайповых фреймверков, типа Angular и React, Vue выглядит наиболее удобоваримым. Однако, многие его решения показались мне не слишком удобными и продуманными. Поэтому снова вернулся к работе с Ractive, который, лично для меня, гараздо удобнее и продуманнее.

Справедливости ради, нужно отметить, что у Vue есть и неоспаримые плюсы по сравнению с Ractive:
  • Vue быстрее по бренчмаркам, чем Ractive. Во всяком случае 2-я версия.
  • Ractive не слишком хайповый, развивается спокойно и стабильно (что скорее плюс), но готовых решений и т.п. намного меньше и само комьюнити тоже.
  • Из-за того что Ractive менее хайповый (у Vue в 10 раз больше звезд на GitHub) найти вакансию с ним сложнее.


В любом случае, как девелопер я скорее маргинал, поэтому мои предпочтения обычно не слишком соответствуют всеобщему тренду. Поэтому прошу сильно не минусовать и помнить, что любое мнение может быть высказано.
Для отладки в браузере существует Vue-devtools (к сожалению, пока только для Chrome)

Не совсем верно
Ещё у Vue восхитительная документация, полностью на русском. Для меня как новичка это снизило порог входа, который и без того низкий.
А для нативных приложений вроде есть официальный Vux, но там пока доки только китайские.
Пришлось для отдельного проекта поизучать Vue, очень пока нравится. У меня, как у angularjs разработчика с 3-х летним стажем, сложилось впечатление, что Vue — это Angular 2 такой, каким он должен был быть и каким его все ждали. Из серьезных минусов — отсутствие хайпа (а это равно отсутствию мануалов, большого количества готовых модулей и альтернатив им) и нежелание авторов хайпить; уклон документации и комментов в китайский. Заиметь бы Вью крупную западную компанию в покровителях, думаю, с легкостью догнал бы «титанов» по популярности.
Это у Vue то нет хайпа? Да он один из трёх самых трендовых фреймверков на данный момент и уж точно стоит в одном ряду с React и Angular. Список спонсоров у него весьма не маленький, хоть там и нет титанов индустрии. Да и всевозможных либ для Vue уже не мало понаписали.
Для отладки в браузере существует Vue-devtools (к сожалению, пока только для Chrome)
Не совсем верно
https://github.com/vuejs/vue-devtools/blob/master/docs/workaround-for-firefox.md
Only those users with full accounts are able to leave comments. Log in, please.