От автора: когда вы создаете с помощью Vue динамический веб-сайт, вы, скорее всего, захотите, чтобы он мог реагировать на события. Например, если пользователь нажимает кнопку, отправляет форму или просто перемещает мышь, вы можете захотеть, чтобы ваш сайт на Vue реагировал каким-либо образом. Обработка событий с помощью Vue Мы можем перехватить событие, добавив директиву v-on в соответствующий элемент DOM. Допустим, мы ...
Читать далее »Архив меток: VueJS
Как Nuxt.js решает проблемы SEO во Vue.js
От автора: в чем именно заключается проблема с vanilla Vue.js и SEO? Vue.js, как и многие другие фреймворки, такие как React, Angular и т. д., является фреймворком на стороне клиента, то есть веб-страница отображается с помощью JavaScript на стороне клиента. Эти приложения обычно называют одностраничными приложениями или SPA. Когда SPA загружается в браузер, сервер отправляет только базовый HTML без какого-либо ...
Читать далее »Как загрузить сторонние скрипты в Nuxt.js
От автора: почти каждое современное веб-приложение использует какую-то зависимость, это даже не считая предпочтительного JavaScript-фреймворка. Хотя большинство зависимостей доступно через NPM, многие из них также предоставляют ссылку на версию CDN (Content Delivery Network), так что она может быть включена в любой проект без дополнительных усилий или этапов сборки. Но есть также немало популярных сторонних библиотек, которые не предоставляют пакет NPM ...
Читать далее »10 лучших практик для создания и поддержки крупных проектов Vue.js
От автора: вот рекомендации, которые я разработала, работая над проектами Vue с большой базой кода. Эти советы помогут вам разработать более эффективный код, который легче поддерживать. Как фрилансер я имела в этом году возможность работать над некоторыми крупными приложениями Vue. Я говорю о проектах с более чем дюжиной хранилищ Vuex, большим количеством компонентов (иногда сотнями) и множеством представлений (страниц). Фактически, ...
Читать далее »Модульное тестирование во Vue: Что тестировать?
От автора: каждый разработчик знает, что он должен писать тесты, но на самом деле, многие из нас не делают этого вообще или не делают этого в достаточной мере. Проблема не в отсутствии инструментов, а в том, что у нас нет четкого понимания того, для чего предназначены эти инструменты. Если бы я вручил вам молоток посреди поля, вы были бы довольно ...
Читать далее »Как указать элемент DOM во Vue
От автора: очень распространенной практикой в веб-разработке является указание элемента DOM (объектная модель документа) (то есть все HTML-элементы и логическая структура, которую они представляют) и манипулирование им каким-либо образом. В этой статье мы рассмотрим возможности ref и некоторые из случаев его применения. Давайте приступим. Рыцари Старой Вьюпублики Для тех из нас, кто переходит от старых технологий, иначе jQuery, мы раньше ...
Читать далее »Простая загрузка динамических изображений во Vue и Nuxt
От автора: импортировать изображения из папки assets, когда путь статичен, не так сложно и во Vue, и в Nuxt.js. Но загрузка изображений с динамическими путями часто сбивает с толку разработчиков, которые являются относительными новичками в одной из этих платформ. В этой статье я хочу продемонстрировать процесс динамической загрузки изображений во Vue и Nuxt. Более того, я объясню, почему статические изображения ...
Читать далее »Как получить больше от асинхронных компонентов Vue
От автора: в основном мы используем асинхронные компоненты Vue, чтобы разделить их на собственные пакеты и уменьшить первоначальный размер пакета. В этой статье я рассмотрю, как получить от этих компонентов больше. Параметры асинхронного компонента Если вы используете Nuxt, вам обязательно понравится функция asyncData, поскольку она позволяет извлекать произвольные данные и вставлять их в данные компонента страницы. Но это работает только ...
Читать далее »Изменение данных компонента с помощью emit Vue.js
От автора: в этом посте мы рассмотрим, как во Vue.js данные и их состояние могут передаваться из дочернего компонента в его родительский компонент с помощью emit — эмиттеров событий. Прежде чем вы начнете… Этот пост подходит для разработчиков всех уровней, включая начинающих. Вот несколько вещей, которые вы должны уже иметь, прежде чем читать эту статью: Установленный Node.js версии 10.x и ...
Читать далее »Как создать приложение воронки продаж с помощью Vue.js
От автора: воронка продаж — это инструмент онлайн-маркетинга, созданный и предназначенный для привлечения лидов и конвертирования их в клиентов. Они имеют тенденцию конвертироваться на 20% до 50% выше, чем обычные веб-страницы. Приложение воронки продаж обычно содержит страницы регистрации, формы заказа, корзины покупок, страницы оформления заказа и программное обеспечение для онлайн-маркетинга. Создание такой системы — непростое дело. Обычный способ построения воронки ...
Читать далее »