{"product_id":"zosia-vue-js-nuxt-frontend-engineer-ai-skill","title":"Zosia — фронтенд-інженер Vue.js\/Nuxt Skill AI","description":"\u003ch2\u003eНе сприймайте систему реактивності Vue як модель повторного рендерингу React.\u003c\/h2\u003e\n\u003cp\u003eZosia — це навичка Senior Vue.js\/Nuxt Frontend Engineer, створена навколо фактичної ментальної моделі Vue: дрібнозернистої системи реактивності на основі проксі, однофайлових компонентів і Composition API, побудованого на composable, а не на хуках із масивами залежностей. Вона охоплює архітектуру Composition API та проєктування composable, систему реактивності (refs, reactive, кешування computed, спостерігачі), керування станом за допомогою Pinia, стратегію рендерингу Nuxt (SSR, SSG, гібридний рендеринг через routeRules у Nitro), маршрутизацію та макети на основі файлів, керування SEO і метаданими, тестування за допомогою Vitest\/Vue Test Utils, а також міграцію з Vue 2 на Vue 3 або з Options API на Composition API.\u003c\/p\u003e\n\u003ch3\u003eДля кого\u003c\/h3\u003e\n\u003cp\u003eДля frontend-інженерів, які працюють із Vue та Nuxt, а також команд, що переходять із Vue 2 або Options API.\u003c\/p\u003e\n\u003ch3\u003eКлючові можливості\u003c\/h3\u003e\n\u003cul\u003e\n  \u003cli\u003eПід час пошуку причин «помилки реактивності» спочатку перевіряє, чи не було деструктуровано об’єкт reactive(), чи не пропущено розгортання через .value і чи не зчитується залежність поза реактивним контекстом.\u003c\/li\u003e\n  \u003cli\u003eРекомендує сховище Pinia лише після підтвердження, що composable із локальним станом справді не може розв’язати завдання.\u003c\/li\u003e\n  \u003cli\u003eОбирає стратегію рендерингу Nuxt для кожного маршруту через routeRules (SSR, SSG, гібридний режим), а не встановлює один глобальний режим для всього застосунку.\u003c\/li\u003e\n  \u003cli\u003eДіагностує розбіжності гідратації, визначаючи фактичну відмінність між сервером і клієнтом (значення, доступні лише на клієнті, невизначений вміст), замість безумовного обгортання всього в ClientOnly.\u003c\/li\u003e\n  \u003cli\u003eСтворює покриття тестами Vitest і Vue Test Utils відповідно до фактичного ризику в composable, сховищі або компоненті, що тестується.\u003c\/li\u003e\n\u003c\/ul\u003e\n\u003ch3\u003eЯк користуватися\u003c\/h3\u003e\n\u003cp\u003eВставте SKILL.md Zosia в інструкції свого Claude Project (або в системний prompt будь-якої AI-системи), а потім опишіть свою проблему, пов’язану з frontend-розробкою на vue.js\/nuxt. Працює з Claude, ChatGPT та будь-яким AI-чатом. Встановлення займає менше 2 хвилин.\u003c\/p\u003e","brand":"KissMySkills","offers":[{"title":"Default Title","offer_id":58342395838728,"sku":null,"price":29.0,"currency_code":"USD","in_stock":true}],"thumbnail_url":"\/\/cdn.shopify.com\/s\/files\/1\/1036\/1444\/7880\/files\/sw33-zosia-vue-nuxt-frontend-engineer-nf.png?v=1785685145","url":"https:\/\/kissmyskills.com\/uk\/products\/zosia-vue-js-nuxt-frontend-engineer-ai-skill","provider":"KissMySkills","version":"1.0","type":"link"}