#vue_3 — Public Fediverse posts
Live and recent posts from across the Fediverse tagged #vue_3, aggregated by home.social.
-
Вторая копия Vue: как лишняя строка в lockfile повесила Chromium
Может ли лишняя запись в yarn.lock повесить браузер? Наша прожила в репозитории три месяца, не привлекая внимания, а потом ночью после релиза положила прод вечным лоадером - причём только в Chromium. Рассказываю, как мы шли к разгадке через ложные следы и что в итоге оказалось в рантайме.
https://habr.com/ru/articles/1068420/
#vue_3 #module_federation #yarn #monorepo #yarnlock #chromium #микрофронтенды #отладка
-
Широкий вход, узкий выход: Vue 3 внутри jQuery‑формы без бесконечных циклов
Добавить на страницу новые функции, не трогая саму страницу, звучит как противоречие. Но альтернативу мы посчитали командой: полное переписывание заняло бы год, в течение которого страница не получила бы ни одной новой функции. Мост между старым кодом и новым занял два месяца, и строил его уже я один. Расскажу, как этот мост устроен, почему получился несимметричным, где чуть не зациклился и что в нём так и осталось кривым.
https://habr.com/ru/articles/1064008/
#Vue_3 #Symfony #jQuery #legacy #миграция_фронтенда #синхронизация_состояния #архитектура_фронтенда
-
Vue Teleport: как работает
Привет, Хабр! Сегодня разберём один из недооценённых, но крайне полезных инструментов во Vue 3 — <Teleport> . Это встроенный механизм, который позволяет рендерить часть шаблона вне текущего DOM‑контекста. Он нужен при реализации модалок, тултипов и других компонентов, которые должны «выпрыгивать» из дерева компонентов, но при этом сохранять реактивность, фокус и доступность. Без этих костылей, z-index: 9999 и appendChild .
https://habr.com/ru/companies/otus/articles/922610/
#vuejs #Vue_3 #Vue_Teleport #Virtual_DOM #useFocusTrap #JavaScript
-
Композиционные хуки во Vue 3: коротко
Привет, Хабр! В этой статье рассмотрим, что такое композиционные хуки во Vue 3, зачем они нужны и как их использовать.
https://habr.com/ru/companies/otus/articles/922582/
#vuejs #Vue_3 #Composition_API #композиционные_хуки #хуки_Vue #useFetch #useMouse
-
Vue 3: Почему ref() — это новая ссылка, а reactive() — обёртка?
Если вы работаете с Vue 3, вы точно сталкивались с ref() и reactive() . Обе функции из Composition API делают значения реактивными — но делают это по-разному. И хотя документация Vue чётко указывает, что использовать в каком случае, она редко объясняет, почему это важно и что может пойти не так , если использовать не тот инструмент. Вот ссылки на официальную документацию — на всякий случай:
-
Как я создал клон Pinterest с использованием Vue 3 и FastAPI
GitHub : Ссылка на репозиторий Live Preview : Посмотреть проект Привет, друзья! В этой статье я расскажу, как создал клон Pinterest с использованием современных технологий — Vue 3 для фронтенда и FastAPI для бэкенда. Это многофункциональное полнофункциональное приложение, практически полностью повторяющее Pinterest. Особенностью проекта является кеширование вкладок с помощью Vue Router и KeepAlive , что значительно улучшает пользовательский опыт. Этот проект стал отличной возможностью прокачать навыки в разработке production-уровня fullstack-приложений с поддержкой функционала в реальном времени .
https://habr.com/ru/articles/903690/
#Vue_3 #FastAPI #restapi #websockets #celery #redis #postgresql #JWT_authentication #nginx #docker
-
Vue 3 под капотом и тонкости Composition API: Reactivity, Provide/Inject, Suspense
Vue 3 уже давно в строю, но его "прокси-движок" и особенности Composition API по-прежнему раскрывают себя всё глубже. В статье мы разберём, как Track/Trigger помогают отслеживать изменения, зачем нужны customRef и как грамотно использовать <Suspense> для асинхронных компонентов. Всё это - на примерах и с советами по оптимизации в крупных проектах. Приступаем к деталям!
https://habr.com/ru/articles/870986/
#vue #vue_3 #javascript #composition_api #реактивность #proxy #customRef #suspense #вебразработка #provideinject
-
Валидация кастомных компонентов в ElementPlus
你好! Меня зовут Дмитрий, я фронтенд-разработчик в компании fuse8. Сегодня мы рассмотрим, как можно проводить валидацию кастомных компонентов в формах из UI-библиотеки ElementPlus. Если вы работали с формами в ElementPlus, то наверняка знаете, что библиотека предоставляет простой интерфейс для валидации. Но что делать, если в форме используется кастомный компонент и необходимо применить правило валидации, которое передали в форму? С этим и разберёмся.
-
Глобальное использование axios в Vue 3 с помощью provide/inject (composition API)
В этой статье мы рассмотрим интересный и удобный способ глобального использования Axios в приложении Vue 3 и composition api. Реализуем прослойку для работы с api используя типизированные запросы и удобное глобальное использование благодаря provide/inject и composition api. Узнать скорее
-
Реализация многооконного приложения на Vue 3
В наше время чуть ли не каждое приложение использует браузерный клиент. Это просто в написании, это кроссплатформенно, это легко в использовании. Браузерные решения уже активно используются и в промышленной сфере: аналитиками, операторами. WEB-приложения для управления промышленными платформами могут быть настолько функциональны, что вся их мощь не укладывается в один монитор, а ведь на рабочем месте может быть ни один, и ни два монитора, а даже больше пяти. Но что же делать, если окна приложений ещё и должны являться частью одной системы и предоставлять возможности удобного взаимодействия между друг другом? Эту проблему я бы и хотел осветить. Меня зовут Дмитрий Дербин – frontend-разработчик компании «Криптонит». В данном материале я поделюсь некоторой теоретической базой по теме и краткими наработками для реализации на Vue 3 на примере простого сайта с погодой.
https://habr.com/ru/companies/kryptonite/articles/810147/
#vue_3 #многооконность #shared_state #multiwindow #localstorage #broadcast_channel #spa #store
-
GridStack + Vue 3 composition api
Мир всем, на связи ShADAMoV ! Сегодня, я бы хотел поведать вам о своём опыте взаимодействия с библиотекой GridStack. Расскажу о странностях и сложностях, с которыми столкнулся в ходе её интеграции во Vue 3 проект. Прежде чем приступим, дисклеймер: автор данной статьи не претендует на истину в последней инстанции и так же не рассказывает про саму технологию, а лишь делится опытом взаимодействия с ней. Прежде чем читать дальше, настоятельно рекомендую прочесть документацию по данной библиотеке от автора (это займет не больше 10 минут). Итак, погнали!