Душный инженер

? 😅 Я думаю, почти каждый, кто работает с Vue 3, через это проходил. Сначала у тебя аккуратный composable… А потом там появляется всё: — API запросы — валидация — watch — состояние — логика UI И в какой-то момент это уже невозможно поддерживать. В новом видео я разобрал реальный пример: — показываю “грязный” вариант (всё в одном файле) — объясняю, почему так делать плохо — и пошагово разбиваю на нормальную архитектуру Ключевая мысль: Composable — это не место, куда складывают всё подряд. Это инструмент для композиции логики. И когда ты начинаешь делить: UI → отвечает за отображение Composable...

: «Идеального проекта не будет нигде и никогда. Нужно стараться, чтобы среди вашей помойки был небольшой оазис, на который вы сможете зайти, отдохнуть, а после вернуться к своей грязной работе и дальше разгребать помойку».

👉 https://youtu.be/bHMIGlh9tzQ Это реальная ситуация из проектов: Backend ещё не готов API может поменяться а тебе уже нужно писать UI В видео показываю подход, который реально используют в проде: — как работать с моками без боли — как отделить UI от API — как не переписывать всё, когда приходит backend — и почему нужен слой адаптера 💡 В итоге: ты меняешь только одно место — и всё продолжает работать 📦 Репозиторий с примером: https://github...

Как Vue обновляет DOM — trigger, scheduler и очередь обновлений count.value++ console.log(el.textContent) // старое значение Кажется, что Vue “тормозит”, но на самом деле внутри происходит намного интереснее: — trigger — scheduler — очередь обновлений — microtask — и только потом обновление DOM В новом видео подробно разобрал: • почему DOM не обновляется сразу • как работают trigger, scheduler и job queue • зачем Vue откладывает обновления • и как всё это связано с nextTick Это продолжение серии про внутренности Vue: 1️⃣ Реактивность и Proxy 2️⃣ computed...

Как Vue отслеживает изменения данных — computed vs watch Во Vue есть несколько способов реагировать на изменения данных: computed, watch и watchEffect. Но на реальных проектах их часто используют неправильно: — пишут лишние watch — делают side effects в computed — не понимают, как работает реактивность под капотом В видео разобрал: • чем на самом деле отличаются computed и watch • какие анти-паттерны встречаются в реальных проектах • и как правильно выбирать инструмент Это продолжение серии про внутренности Vue:...

». Стандартные напоминания в телефоне так не умеют — там либо один раз, либо каждый день в одно время. А мне было нужно вот так: — с 9:00 до 12:00 напоминать каждые 5 минут — с 14:00 до 17:00 — раз в час Пока повторения базовые: ежедневно, по будням, в выходные. Более гибкие правила — в планах. Попробовать:...

Если вы со мной давно, то могли заметить: регулярность постов и видео снизилась. И хочу честно рассказать, с чем это связано. Помимо основной работы и семьи, я вошёл в рабочую группу по FSD (Feature-Sliced Design - https://t.me/feature_sliced , https://fsd.how/). Мы продолжаем развивать методологию, улучшаем её и стараемся помогать командам — советами, примерами и разбором реальных кейсов. Неделю назад я даже поучаствовал в подкасте на тему FSD — для меня это тоже новый этап (https://www.youtube.com/watch?v=3_q3swKigeU&t=13s). В целом нагрузка стала больше. Идей для постов и видео много, но времени, как это ни банально звучит, не всегда хватает...

🎥 nextTick во Vue — зачем он нужен на самом деле Разобрал одну из самых непонятных вещей во Vue: — почему ты меняешь данные, а DOM ещё старый — откуда берутся баги с размерами, скроллом и фокусом — что делает nextTick под капотом Если ты хоть раз: — лез в DOM после изменения state — получал старые значения — или просто копировал nextTick из StackOverflow это видео для тебя 👇 https://www...

🎥 Vue — не магия. Как работает реактивность В видео разбираю: — что на самом деле означает «реактивность» — как Vue отслеживает изменения данных — почему переход на Proxy полностью изменил Vue 3 — чем ref отличается от reactive и откуда берётся .value Без абстракций и «магии» — только понимание того, как Vue реально работает под капотом. Если ты когда-то: — путался в ref...

Новая часть проекта «Личный кабинет интернет-провайдера» уже на канале 🚀 Сегодня разбираем две реальные ошибки, с которыми часто сталкиваются при разработке на Vue 3 + TypeScript в production-проектах. 👉 почему появляется ошибка inject() can only be used inside setup() 👉 почему assert function нельзя использовать в computed бездумно и какие проблемы это вызывает В видео я объясняю не только как починить, но и почему эти ошибки возникают, чтобы ты мог избежать их в будущем. 📌 Что разбираем в этом видео: * почему useRouter нельзя вызывать вне script setup * как правильно работать с inject...

Новая часть проекта «Личный кабинет интернет-провайдера» уже на канале 🚀 Сегодня разбираем одну из самых важных архитектурных тем — инициализацию приложения. Показываю, как собрать разрозненную логику старта приложения в единый глобальный bootstrap: инициализация пользователя, установка HTTP-токена, route guards и redirect-логика — в одном управляемом месте. 📌 Что разбираем в этом видео: * что такое bootstrap приложения и зачем он нужен * какие инициализационные процессы есть в реальном проекте * инициализация авторизованного пользователя * установка токена в HTTP-клиенте при старте приложения...

Новая часть проекта «Личный кабинет интернет-провайдера» уже на канале 🚀 Сегодня разбираем две важные и часто недооценённые темы при работе с Pinia и TypeScript: 👉 как не потерять реактивность store при деструктуризации 👉 как и зачем использовать assert function в реальных проектах В этом видео я показываю типичные ошибки, с которыми сталкиваются разработчики, и объясняю, как писать код, который остаётся стабильным и предсказуемым по мере роста проекта. 📌 Что делаем в этом видео: * разбираем, почему store теряет реактивность при обычной деструктуризации * правильно деструктурируем Pinia...