Одним из новых инструментов в арсенале Vue 3 является Vite - быстрый и легковесный бандлер, который значительно упрощает процесс разработки и ускоряет сборку проекта. В этой статье мы рассмотрим, как перейти от стандартного подхода с использованием Vue-CLI и Webpack к более продвинутому и эффективному методу работы с помощью Vite.
Всем привет! Это вторая статья из цикла статей о разработке приложений в нашей компании. В первой статье я рассказал Вам про общую архитектуру некоторых наших проектов. В данной статье хочется описать наши варианты решения часто встречающихся задач в рамках Django + Vue приложения.
Мне не раз попадались такие проекты, от кода которых берет оторопь. Такое чувство, что сами авторы не смогут объяснить - почему у них все выглядит именно так. В этот момент у меня возникает вопрос: как так получилось? Если вас он тоже волнует, то могу пожелать лишь приятного чтения.
Всем привет!
Мы продолжаем строить собственный SSO Server. Сегодня мы детально разберем Vue.js приложение, а также спроектируем и реализуем долгожданные механизмы регистрации и сброса пароля. Как всегда, дополнительно мы разберём ряд интересных общесистемных решений, которые наверняка Вам пригодятся в дальнейшем.
Валидация форм является важной частью фронтенд-разработки, которая помогает улучшить пользовательский опыт и предотвратить ошибки при отправке данных на сервер. В этой статье мы рассмотрим, как использовать библиотеку AJV совместно с Vue.js и TypeScript для создания мощной системы валидации формы.
Недавно компания Facebook* (aka Meta**) выпустила в опенсорс собственную CSS-in-JS библиотеку под названием StyleX. По заявлениям разработчиков, она отлично подходит для больших проектов и ключевым ее преимуществом является перфоманс.
В этой статье мы рассмотрим пример использования, основные функции и особенности данного решения.
Верней оформил 5 декабря 2023 года оформил для всех то, чем его разработчики пользуются уже давно. Позиционируется данный помощник для js-подобных фреймворков типа React, Preact, Solid, lit-html и Angular, однако оперирующие html шаблонами Vue и Svelte тоже могут задействовать StyleX, но после предварительной специальной её кастомизации.
Код в React в итоге выглядит примерно так:
На Reddit прошла интересная дискуссия с 25К+ просмотрами по вопросу предпочтений разработчиков при необходимости управлять глобальным состоянием во Vue 3. Ниже её итоги.
Все мы знаем что такое клиент-серверное приложение, на тему их создания написано не мало статей. В этой статье хотелось бы поделиться с вами наработками нашей компании, которыми мы пользуемся в своих Django проектах.
Как я проектировал свой самый большой проект, сложности с которыми я столкнулся. Фишки и неочевидные моменты при разработке.
Google и Yandex утверждают, что что-то уже могут по индексированию SPA приложений. В статье показаны результаты проведенного эксперимента по индексации чистого SPA вебсайта.
Результат: Google - хорошо, Yandex - не очень
Разбираемся, что же такое conditional types и как написать свои утилиты, такие как ReturnType, InstanceType, NonNullable и др., при помощи ключевых слов infer и extends.
После выхода крайней и достаточно революционной в плане добавления Composition API версии Vue 3.0 более чем три года назад, каких-либо серьезных изменений от команды Evan You в самом фреймворке больше не было. Только стандартные багфиксы, оптимизация и робкие попытки стать с TypeScript ближе. Основное внимание переключилось на экосистему - Vite, Nuxt, VitePress, Pinia и другие.
В то же время, отчетливо заметно масштабирование работы не вглубь, а вширь. Интересы команды уже давно явно выходят за пределы фреймворка.
Vue 3 вебсайт билдер (npm пакет vue-webapp) позволяет создать каркас будущего веб приложения, с возможностью выбора бизнес-шаблона (портфолио, блог, магазин и .т.д.), макета сайта, дизайна и элементов функционала (API модуль, i18n, PWA, splash screen, auth модуль, темы и т.д.), для дальнейшей кастомизации и наполнения контентом.
Vue + Form. А можно немного попроще...
Краткий путь по созданию библиотеки для работы с полями и формами . В статье описан краткий путь от v-modal к чему-то более умному и самостоятельному. Я также поделился своими наработками, чтобы вы могли использовать их у себя в проекте.
Вносить изменения в код приложения и тут же автоматически получать задеплоенные изменения, чтобы быстро тестировать его, — мечта разработчика. В этой статье мы посмотрим, как реализовать такой подход для небольшого приложения с фронтендом и бэкендом: организуем два варианта локального стенда на базе minikube или Docker с автоматическим развертыванием всех изменений или только закоммиченых в Git.
Бэкенд приложения напишем на Go, а фронтенд — на Vue.js. Все это позволит быстро запускать проект для тестирования прямо во время разработки, что, несомненно, повысит удобство работы с приложением.
В статье сравниваются два подхода к созданию веб интерфейса пользователя. Один подход - это современные фраймворки с компонентами, которые инкапсулируют HTML, js, css. Второй подход к разработке веб-интерфейса аналогичен разработке интерфейса пользователя десктопного приложения.
Разбираемся с provide-inject до конца. Что он может? Поговорим о том, как его использовать, зачем он вообще нужен и можно ли удобно настроить использование этой фичи в приложении.
Управление глобальным состоянием
В прошлой части мы рассмотрели методологии оптимизации и реюзабельности логики, а так же подход к роутингу каждого фреймворка. Однако давайте теперь переключим наше внимание на другой важный аспект - управление глобальным состоянием. В этом разделе на примере Angular, React и Vue мы рассмотрим уникальные стратегии, используемые этими фреймворками для работы с глобальными состояниями. По мере изучения этих подходов мы узнаем, как разработчики эффективно решают сложную задачу поддержания синхронизации данных в приложениях.
Transition, который упрощает процесс внедрения переходов во Vue-приложениях. В этой статье мы рассмотрим принцип работы компонента Transition Vue 3 и продемонстрируем его использование на реальных примерах.