А накидайте мне на вентилятор, почему разделение SFC на файлы, может быть лучше чем просто SFC? И наоборот, чем SFC лучше разделения на отдельные файлы?
Выдаём базу по базе по композишн апи
https://michaelnthiessen.com/13-vue-composables-tips
https://michaelnthiessen.com/13-vue-composables-tips
Полезные советы при разработке с
1. Используйте по возможности системный промпт.
Напишите свой и попросите
2. Научитесь азам promp-engineering. Это полезно и при разработке, и при диалогах с обычными чатботами. От простого
3. Используйте сильные стороны
4. Используйте его как консультанта перед реализацией какой-то задачи. Задайте несколько вопросов в чате, как что-то можно сделать (с использованием вашего кода как контекста), проанализируйте варианты, выберите подходящий и дальше в
4.1. Вместо «Напиши такой-то модуль» используйте цепочку:
- Проектирование API
- Реализация core-логики
- Добавление обработки ошибок
- Интеграция с существующим кодом
- Оптимизация производительности
5.
6.
7. При использовании
8. Пробуйте разные модели. Причем, разные модели для разных случаев. Дороже ≠ лучше.
9. Переиспользуемые промпты можно хранить в отдельных текстовых файлах. Научитесь использовать структурированные промпты при необходимости, например:
Для современных
10. Почитайте документацию к вашей
#ai #tip #ide #cursor
IDE
AI
агентами от @vuefaq.1. Используйте по возможности системный промпт.
Cursor
позволяет иметь .cursorrules
файл, в котором можно прописать основные установки по проекту. Пример файла.Напишите свой и попросите
AI
улучшить его. Автокомплит его плохо видит, но чат и composer
- вполне. По крайней мере, свою CSS
дизайн систему и компоненты использует четко.2. Научитесь азам promp-engineering. Это полезно и при разработке, и при диалогах с обычными чатботами. От простого
few-shots prompt
эффективность результата может вырасти в разы. Не надо винить AI
в тупости, если вы не умеете формулировать вопрос на языке, который ему более понятен.3. Используйте сильные стороны
AI
. Он может хорошо сгенерить новый компонент, новый микросервис, добавить функционал, сделать i18n
перевод, дать совет по какой-то лучше практике в определённой области, рефакторинг, делать рутинные задачи, писать тесты, но не так хорошо работает на больших изменениях с существующим кодом. Также может с нуля нагенерировать плохой неоптимальный код на нестандартных задачах (в таких случаях, необходимо давать максимально подробную информацию о контексте задачи).4. Используйте его как консультанта перед реализацией какой-то задачи. Задайте несколько вопросов в чате, как что-то можно сделать (с использованием вашего кода как контекста), проанализируйте варианты, выберите подходящий и дальше в
composer
начните постепенно его реализовывать, руководя процессом. Стратегически важные вопросы задавайте также разным внешним системам - Gemini
, ChatGPT
, DeepSeek
. Иногда кто-то один даёт явно более лучший ответ.4.1. Вместо «Напиши такой-то модуль» используйте цепочку:
- Проектирование API
- Реализация core-логики
- Добавление обработки ошибок
- Интеграция с существующим кодом
- Оптимизация производительности
5.
AI
- не старик Хоттабыч, он не творит чудеса. Более того, он очень тупой. Тупой инструмент. Но сильный. Управление им это как управление двухтонным ковшом экскаватора - можно быстро сделать много полезного, и можно быстро сделать кучу плохого (со своим кодом). Которую потом будешь долго разгребать.6.
AI
хорошо генерит комментарии и документацию. Можете добавить сразу VitePress
к проекту и поддерживать его техническую документацию.7. При использовании
AI
сервисов в приложении используйте структурированные (JSON
) ответы. Не все это умеют, но последняя 4o-mini
, например, умеет (по JSON-scheme
). С учетом цены на нее, она очень полезна для парсинга документов или картинок, скажем, из которых предварительно можно вытащить текст конвенциональными методами (pdf2text
и OCR
).8. Пробуйте разные модели. Причем, разные модели для разных случаев. Дороже ≠ лучше.
9. Переиспользуемые промпты можно хранить в отдельных текстовых файлах. Научитесь использовать структурированные промпты при необходимости, например:
/analyze-tech-debt
--focus=duplication,complexity
--suggest-refactoring
Для современных
LLM
они, часто, предпочтительней для простых задач.10. Почитайте документацию к вашей
LLM
и лучшие практики. Ваша продуктивность ( => стоимость как разработчика) может возрасти в несколько раз с этим инструментом. Потратьте время на то, чтобы научиться им эффективно пользоваться.#ai #tip #ide #cursor
Покидайте курсы и конференции для фронтендеров и тимлидов которые вы считаете топовыми (не обязательно по вую, и даже не по фронтенду можно, для общего развития тоже полезно)
Душный Вуй
Покидайте курсы и конференции для фронтендеров и тимлидов которые вы считаете топовыми (не обязательно по вую, и даже не по фронтенду можно, для общего развития тоже полезно)
https://eduson.academy/team-management
https://otus.ru/lessons/teamlead2-0/
https://practicum.yandex.ru/team-management-development/
https://skillbox.ru/course/software-architect/
https://otus.ru/lessons/teamlead2-0/
https://practicum.yandex.ru/team-management-development/
https://skillbox.ru/course/software-architect/
eduson.academy
Курс Управление командой
Онлайн-курс для руководителей, на котором вы получите необходимые навыки современного управленца: от построения коммуникации в команде до внедрения инноваций и управления изменениями. Вы научитесь находить креативные пути решения задач и освоите различные…
И снова про пропс дриллинг
https://alexop.dev/posts/solving-prop-drilling-in-vue/
https://alexop.dev/posts/solving-prop-drilling-in-vue/
alexop.dev
Solving Prop Drilling in Vue: Modern State Management Strategies | alexop.dev
Eliminate prop drilling in Vue apps using Composition API, Provide/Inject, and Pinia. Learn when to use each approach with practical examples.
Видели такое? https://developer.mozilla.org/en-US/docs/Learn_web_development/Core/Frameworks_libraries/Vue_getting_started
MDN Web Docs
Getting started with Vue - Learn web development | MDN
Now let's introduce Vue, the third of our frameworks. In this article we'll look at a little bit of Vue background, learn how to install it and create a new project, study the high-level structure of the whole project and an individual component, see how…
И так, время идет, а я все жду когда мой доклад с Holy.js выложат :D
В итоге все затянулось и данный пост отложился слишком сильно. Поэтому подведу запоздалые итоге 2024 и этим вдохну жизнь в канал (да-да настолько запоздалые).
Если кратко 2024 для меня стал годом конференций. Побыл в разных ролях.
Был и спикером по началу: UfaDevConf-раза, Holy.js 2-раза, Стачка, Msk Vue.js, Omsk DevFest ну и внутренние выступления в компании
К середине года попробовал для себя уже на уровне эксперта секции(Стачка), ведущего секции(UfaDevConf)
И главным подарком под Новый Год для меня стало, что меня взяли в программный комитет Holy.js и уже весь 2025 я погружен в процесс уже организации конференций, от чего получаю большое удовольствие (прямо сейчас идет работа над 4-мя(!) мероприятиями).
Другой вектор это телеграм и сообщества. Например, достижение 2024-ого года стал администратором Vue.js сообщества. И вступил в большое количество сообществ фронтендеров, где меня сейчас легко встретить. Считаю в этом плане год успешным.
Да, стримов и постов было очень мало, так как открывал для себя новый мир и продолжаю в него погружаться. Так что контент делаю, просто в новой области для меня.
Что можно ожидать в 2025:
1) Оживление канала с постами, идей накопилось очень много и технических и софтовых.
2) Стримов пока можно не ждать (стримы будут после переезда в квартиру попросторнее, жду ключи на нее). Однако я переодически буду появляться как участник на чужих стримах, если меня пригласят (siberiacancode, kirjs и тд)
3) Ждать от меня новостей по моим продуктам (можно ожидать от меня в 2025 году курс по Vue.js. Да-да официальный анонс, и да, он будет полностью бесплатным и доступным для всех)
4) Новая группа бесплатного интенсива по Vue.js длиной в 2 недели как и в прошлом году (скорее всего летом)
5) Новые выступления на митапах и конференциях
Год выдался отличным, и новый, надеюсь, будет еще лучше!
В итоге все затянулось и данный пост отложился слишком сильно. Поэтому подведу запоздалые итоге 2024 и этим вдохну жизнь в канал (да-да настолько запоздалые).
Если кратко 2024 для меня стал годом конференций. Побыл в разных ролях.
Был и спикером по началу: UfaDevConf-раза, Holy.js 2-раза, Стачка, Msk Vue.js, Omsk DevFest ну и внутренние выступления в компании
К середине года попробовал для себя уже на уровне эксперта секции(Стачка), ведущего секции(UfaDevConf)
И главным подарком под Новый Год для меня стало, что меня взяли в программный комитет Holy.js и уже весь 2025 я погружен в процесс уже организации конференций, от чего получаю большое удовольствие (прямо сейчас идет работа над 4-мя(!) мероприятиями).
Другой вектор это телеграм и сообщества. Например, достижение 2024-ого года стал администратором Vue.js сообщества. И вступил в большое количество сообществ фронтендеров, где меня сейчас легко встретить. Считаю в этом плане год успешным.
Да, стримов и постов было очень мало, так как открывал для себя новый мир и продолжаю в него погружаться. Так что контент делаю, просто в новой области для меня.
Что можно ожидать в 2025:
1) Оживление канала с постами, идей накопилось очень много и технических и софтовых.
2) Стримов пока можно не ждать (стримы будут после переезда в квартиру попросторнее, жду ключи на нее). Однако я переодически буду появляться как участник на чужих стримах, если меня пригласят (siberiacancode, kirjs и тд)
3) Ждать от меня новостей по моим продуктам (можно ожидать от меня в 2025 году курс по Vue.js. Да-да официальный анонс, и да, он будет полностью бесплатным и доступным для всех)
4) Новая группа бесплатного интенсива по Vue.js длиной в 2 недели как и в прошлом году (скорее всего летом)
5) Новые выступления на митапах и конференциях
Год выдался отличным, и новый, надеюсь, будет еще лучше!
Покринжуем (или пообсуждаем) на ночь глядя?
https://habr.com/ru/companies/bitrix/articles/880530/
https://habr.com/ru/companies/bitrix/articles/880530/
Хабр
Интеграция Vue.js в Битрикс24: Как разработать сложный фронтенд за два месяца
Интерфейс Онлайн-записи Представьте, что к вам приходит владелец продукта с видео-концептом новой фичи для клиента, функционал которой отдаленно напоминает космический корабль, а у вас всего два...
А что используете вы в качестве основного средства разработки на Vue?
Anonymous Poll
43%
VS Code
43%
Web Storm
14%
Другое (отпишу в комментарии)
О, Денис Чернов будет вести канал про вуй, это мы увожаем, это мы подписываемся
https://t.me/zede_code/120
https://t.me/zede_code/120
Telegram
zede code
Одна из больших диллем для меня была как часто сюда писать и какой контент тут генерировать.
Первое что стоит признать: у меня очень разношерстная аудитория, тут и реактеры с гигантским стажем и вьюшники и даже те кто фронту отношения вообще не имеют и многие…
Первое что стоит признать: у меня очень разношерстная аудитория, тут и реактеры с гигантским стажем и вьюшники и даже те кто фронту отношения вообще не имеют и многие…
И так напоминалка о том что каждые пол года нам открывают полный доступ к базе 1 из 2 основных школ специализирующихся на Vue и Nuxt
В этот раз бесплатные выходные будут у vueschool(с 1 по 2 марта).
Я не могу назвать курсы прям суперскими и мастхэвными, но любители у такого всегда есть. Их там большой выбор, может чего и приглянется
В этот раз бесплатные выходные будут у vueschool(с 1 по 2 марта).
Я не могу назвать курсы прям суперскими и мастхэвными, но любители у такого всегда есть. Их там большой выбор, может чего и приглянется
vueschool.io
Vue School Free Weekend: 48 Hours of Unlimited Access
Sign up for Vue School's Free Weekend on Nov 2-3, 2024. Get unlimited access to 65+ premium Vue.js courses for 48 hours. Learn from industry experts!
Опять тесты эти ваши
https://alexop.dev/posts/visual-regression-testing-with-vue-and-vitest-browser/
https://alexop.dev/posts/visual-regression-testing-with-vue-and-vitest-browser/
alexop.dev
How to Do Visual Regression Testing in Vue with Vitest? | alexop.dev
Learn how to implement visual regression testing in Vue.js using Vitest's browser mode. This comprehensive guide covers setting up screenshot-based testing, creating component stories, and integrating with CI/CD pipelines for automated visual testing.
Глубокий Vue
Как изучать Vue разработчикам с опытом которые уже доки знают неплохо, но хотят двигаться дальше?
Самый логичный ответ: вперед штудировать исходный код Vue!
Отличный вариант но... это весьма муторно и трудоемко, а многих в целом может отпугнуть от погружения
Неужели нет годных статей и выступлений? Есть, но выискивать их трудно, а следить за их актуальностью и появлениями еще сложнее. Неужели нет варианта лучше?
На самом деле есть: это подход create from scratch(создать с нуля)
Те мы берем Vue и пытаемся воссоздать его с самого нуля тем самым знакомясь с его механизмами и почему были сделаны те или иные решения.
К счастью, уже есть проект который сосредоточен на объяснении всего этого доступным языком: chibivue. Книга готова не на 100%, но большая часть уже проделана и возможно к определенному моменту вы и так будете готовы к чтению исходников. Что хорошо в книге не только теория, но и большое количество примеров с плейграундом. С ней вы создадите Vue самостоятельно и познакомитесь как все работает под капотом.
Кстати, проект затрагивает исходники не только Vue, но и других проектов:
- изучение исходного кода Vapor
- пишем свой VueUse (проект в глубокой разработке еще)
PS Запили с нейронками RU версию chibivue
PPS Так-то и английская версия сайта это результат работы нейронки(переводится через GPT-3.5 автоматизированно), оригинал пишется на японском
Как изучать Vue разработчикам с опытом которые уже доки знают неплохо, но хотят двигаться дальше?
Самый логичный ответ: вперед штудировать исходный код Vue!
Отличный вариант но... это весьма муторно и трудоемко, а многих в целом может отпугнуть от погружения
Неужели нет годных статей и выступлений? Есть, но выискивать их трудно, а следить за их актуальностью и появлениями еще сложнее. Неужели нет варианта лучше?
На самом деле есть: это подход create from scratch(создать с нуля)
Те мы берем Vue и пытаемся воссоздать его с самого нуля тем самым знакомясь с его механизмами и почему были сделаны те или иные решения.
К счастью, уже есть проект который сосредоточен на объяснении всего этого доступным языком: chibivue. Книга готова не на 100%, но большая часть уже проделана и возможно к определенному моменту вы и так будете готовы к чтению исходников. Что хорошо в книге не только теория, но и большое количество примеров с плейграундом. С ней вы создадите Vue самостоятельно и познакомитесь как все работает под капотом.
Кстати, проект затрагивает исходники не только Vue, но и других проектов:
- изучение исходного кода Vapor
- пишем свой VueUse (проект в глубокой разработке еще)
PS Запили с нейронками RU версию chibivue
PPS Так-то и английская версия сайта это результат работы нейронки(переводится через GPT-3.5 автоматизированно), оригинал пишется на японском
chibivue
Writing Vue.js: Step by Step, from just one line of "Hello, World".