ООП для управления состоянием во Vue

Чувак, уже есть Pinia , Pinia Colada , TanStack Query для Vue, зачем ещё один способ управлять состоянием во Vue? Меня просто задолбало писать везде флаги отслеживания состояния для действий и делать store через фабричную функцию, как это делали наши праотцы в начале 2000-х. Запоминать зоопарк из разных composable-функций и хуков. Изучать какую-то другую систему реактивности, типа MobX, тоже не хочу. Это какой-то зашквар. Я хочу использовать то, что есть: реактивность Vue везде, классы, методы. Хочу использовать классические шаблоны: SOLID, DDD и т.п. Хочу, чтобы Действие или запрос сами отслеживали и сообщали своё состояние. Хочу сконцентрироваться на бизнес-логике и писать меньше шаблонного кода. И это возможно, покажу, как это работает на примере. Погнали, если интересно

https://habr.com/ru/articles/1010774/

#vue #pinia #tanstack #store #ооп_программирование #solid #ddd #архитектура_фронтенда #typescript #javascript

Персональный ГеоОрганайзер «Места»

Есть множество специальных программ, работающих с метаданными — всевозможные (не будем показывать пальцем) медиаплееры с нескучными обоями, сортировкой и фильтрами по чему и как угодно (особенно как угодно), созданием и редактированием плейлистов, подгружаемыми обложками, текстами и барышнями. Есть, с позволения сказать, просмотрщики изображений с теми же барышнями, коллекциями оных с описаниями, редактированием, тэггированием, гистограммами, спектрограммами и телепрограммами. И один лишь рынок особой категории геоданных, именующих себя детьми лейтенанта Шмидта, находится в хаотическом состоянии. Анархия раздирала корпорации вроде Гугла… Ладно, я увлёкся. Но в самом деле…

https://habr.com/ru/articles/1009226/

#Vue #Pinia #Open_Source #geo #геоданные #карты #SPA #Batch_Update #pwa #typescript

Переезд с Nuxt 2 на Nuxt 3: почему для крупного интернет-магазина мы выбрали рерайт, а не миграцию

Пять лет назад мы запустили интернет-магазин на Nuxt 2. За это время он превратился в классический монолит: вносить правки стало дорого, а сайт начал «задыхаться» под нагрузкой. Когда вышел Nuxt 3, перед нами встал выбор: пытаться оживить проект через Nuxt Bridge или переписать всё с нуля. Мы проанализировали код и поняли: плавная миграция для нас — это путь к созданию «зомби-проекта». Слишком много фундаментальных отличий: Options API против Composition API, Vuex против Pinia, смена логики роутинга и несовместимость ключевых библиотек. В этой статье я рассказываю, как мы решились на полный рерайт крупного магазина стройматериалов и почему это было единственно верным стратегическим решением. Внутри кейса: — 4 технических «фаталити» , которые делают миграцию легаси-монолита невозможной. — Архитектура FSD + Nuxt 3: как мы подружили фронтенд с бэкендом на Symfony и навели порядок в зависимостях. — Паттерн «Фабрика»: как упростить сложную логику доставки в Composition API. — Бонус: почему благодаря правильному старту недавнее обновление с Nuxt 3 до Nuxt 4 заняло у нас минимум времени, в отличие от мучений с Nuxt 2. Если вы всё еще поддерживаете проекты на второй версии и боитесь подступиться к обновлению — этот опыт для вас.

https://habr.com/ru/articles/968118/

#nuxtjs #pinia #feature_sliced_design #vite #composition_api #интернетмагазин #typescript

https://alexop.dev/posts/solving-prop-drilling-in-vue/

#vue, #pinia, #webdev

Vue 2 в 2025: какие паттерны стоит забыть, а какие – оставить

Vue 2 в 2025 году официально стал legacy, но множество проектов всё ещё работают на нём. Миграция на Vue 3 не всегда возможна сразу, поэтому важно правильно поддерживать и модернизировать старый код. В этой статье разберём: Устаревшие паттерны, от которых лучше избавиться. Проверенные подходы, которые остаются актуальными. Альтернативы из Vue 3, которые можно адаптировать уже сейчас

https://habr.com/ru/articles/928578/

#vue3 #pinia #typescript #javascript #vue2 #vue27

#devlog #MyRuckClub

- Moved #turso from #libSql to fetch to mitigate CORS issues.
- Realized through the migration step above, that each time the events page refreshes each event item made a turso call, thus to mitigate this setup a #pinia store.
- The pinia store has made the app faster, since the all turso calls done on first load and then functions off of that data.

How to use Pinia with Storybook

#vuejs #storybookjs #pinia

https://prostocode.com/posts/how-to-use-pinia-with-storybook

Обзор различных тактик работы с реактивным стейтом во Vue

В статье рассмотрены различные методы организации обмена данными и реактивным состоянием во Vue.js приложениях, как то: - Prop drilling - Provide/Inject - Composition API - Pinia - Event Bus

https://habr.com/ru/articles/878722/

#state #pinia #store