Что такое Vue.js?

Vue.js — это интерфейсный фреймворк JavaScript и модель «представление-представление» с открытым исходным кодом, в основном используемая для создания пользовательского интерфейса и одностраничных приложений. Он позволяет расширить язык гипертекстовой разметки (HTML) с помощью HTML-атрибутов, называемых директивами. Эти директивы расширяют функциональные возможности HTML-приложений.Vue.jsпредлагает лучшее из обоих миров, объединяя лучшее из Angular и React.

История

Vue.js был создан Эваном Ю. До этого он работал в Google, используя AngularJS в ряде проектов. Первая фиксация исходного кода проекта была сделана в июле 2013 года, а Vue был впервые выпущен в следующем феврале, в 2014 году. Vue.js поддерживается Эваном Ю и остальными активными членами основной команды. Название фреймворка «Vue» фонетически на английском языке такое же, как view, оно соответствует традиционной архитектуре Model-View-Controller (MVC).

Преимущества

o Двусторонняя связь

В отличие от ReactJS, Vue.js обеспечивает двустороннюю связь, также называемую двусторонней привязкой данных, благодаря своей архитектуре MVVM. Двусторонняя привязка означает, что любые изменения, которые мы вносим в пользовательский интерфейс, передаются в данные, а изменения, сделанные в данных, отражаются в пользовательском интерфейсе.

о Легко понять

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

о Гибкость

Используя виртуальные узлы, он позволяет пользователю писать свой шаблон в файле HTML и файле JavaScript. Эта гибкость также упрощает понимание разработчиками любой другой среды JavaScript. Как AngularJS и ReactJS

o Крошечный размер

Фреймворк загружается очень быстро, так как загруженный zip-файл с фреймворком весит 18 КБ. Как глазурь на торте, это также положительно влияет на SEO.

o Повторное использование компонентов.

Инкапсулированные компоненты можно повторно использовать в качестве шаблонов для аналогичных элементов системы позже.

o Подробная документация

Vue.js обладает подробной документацией. Документация по Vue.js настолько обширна, что любой пользователь с базовыми знаниями может разработать собственное приложение или веб-страницу.

Недостатки

о Новое

Vue.js — относительно молодая технология по сравнению с другими фреймворками. Несмотря на то, что он приобрел большую популярность, Vue.js потребуется еще несколько лет, чтобы прочно закрепиться на рынке, как ReactJS сейчас.

o Отсутствие поддержки

В отличие от ReactJS, поддерживаемого Facebook, и AngularJS, поддерживаемого Google, наш Vue.js поддерживается той же командой, которая разработала Vue.js, но эта команда невелика, что приводит к ограниченной поддержке.

o Языковые барьеры

Создатели Vue.js — американцы китайского происхождения, и они предпочитают китайский язык любому другому. Кодирование фреймворка, написанного на китайском языке, у многих создает проблемы.

oОграниченные подключаемые модули

Vue.js является новым и, более того, он все еще находится в стадии разработки, поэтому поддержка многих плагинов недоступна.

Применения Vue.js

Расширение HTML и база JS сделали Vue популярным интерфейсным инструментом. Давайте посмотрим на некоторые из крупнейших компаний, которые доверились Vue.js и где они применяли Vue-

Ø Google

Google использует Vue для своей карьерной страницы.

ØЯблоко

Appleиспользует Vue в своем руководстве по SwiftUI.

Ø Нинтендо

Нет любителя игр, который никогда не слышал о Nintendo. Vue реализован в их программе лояльности My Nintendo.

Ø Trivago

Trivago решили использовать Vue с Nuxt для своего журнала.

Ø Gitlab

Gitlab поставляется как единое приложение, разработанное с помощью Vue.

Ø Масштаб

Zoom сыграл решающую роль во время блокировки. Zoom использует Vue для своего веб-приложения.

Привет, мир на Vue.js

‹!DOCTYPE html›

‹html язык="ru"›

‹метакодировка="UTF-8›

‹title›Hello World в Vue.js‹/title›

‹div id="hello-world-app"›

‹h1›{{ сообщение }}‹/h1›

‹/дел›

‹скрипт

src="//cdnjs.cloudflare.com/ajax/libs/vue/2.1.6/vue.min.js"›

‹/скрипт›

‹скрипт›

новый Vue({

эл: «#привет-мир-приложение»,

данные() {

возвращение {

сообщение: «Привет, мир!»

}

}

});

‹/скрипт›

‹/html›

IDE для Vue.js

о Код ВС

о веб-шторм

о атом

Официальный документ-

"Кликните сюда"

Официальные инструменты

· Инструменты для разработчиков

· Интерфейс командной строки Vue

· Загрузчик Vue

Официальные библиотеки

· Вью-роутер

· Векс

· Рендерер сервера Vue

Курсы

o Vue JS Essentials с Vuex и Vue Router (Udemy)

o Vue JS 2 — Полное руководство (Udemy)

o Vue.js: Начало работы, Чад Кэмпбелл (Pluralsight)

Книги

o Vue.js: запуск и запуск: создание доступных и эффективных веб-приложений от O’Reilly Media

o Vue.js в действии от Manning Publications

o Изучение Vue.js 2: узнайте, как легко создавать удивительные и сложные реактивные веб-приложения с помощью Vue.js от Packt Publishing

Вывод

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