Главная » Архив меток: VueJS

Архив меток: VueJS

Руководство по созданию мультиязычного сайта с Nuxt.js

От автора: это руководство предназначено для начинающих и профессионалов, которые хотят создать полноценный многоязычный веб-сайт с помощью Nuxt.js. С использованием этого пошагового руководства вы получите динамический веб-сайт Nuxt.js, работающий на сервере now, с использованием API для многоязычного контента. Если вы спешите, то можете скачать весь проект (nuxtblok.now.sh) на Github. Настройка среды Что вам потребуется: Базовое понимание NuxtJs VueJs и их ...

Читать далее »

Обработка событий с помощью Vue.js

От автора: когда вы создаете с помощью Vue динамический веб-сайт, вы, скорее всего, захотите, чтобы он мог реагировать на события. Например, если пользователь нажимает кнопку, отправляет форму или просто перемещает мышь, вы можете захотеть, чтобы ваш сайт на Vue реагировал каким-либо образом. Обработка событий с помощью Vue Мы можем перехватить событие, добавив директиву v-on в соответствующий элемент DOM. Допустим, мы ...

Читать далее »

Как 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 и ...

Читать далее »