Найти в Дзене
⚡️ Vue 3 | Ошибка inject() вне script setup + assert function в computed | Разбор ошибок
Новая часть проекта «Личный кабинет интернет-провайдера» уже на канале 🚀 Сегодня разбираем две реальные ошибки, с которыми часто сталкиваются при разработке на Vue 3 + TypeScript в production-проектах. 👉 почему появляется ошибка inject() can only be used inside setup() 👉 почему assert function нельзя использовать в computed бездумно и какие проблемы это вызывает В видео я объясняю не только как починить, но и почему эти ошибки возникают, чтобы ты мог избежать их в будущем. 📌 Что разбираем в этом видео: * почему useRouter нельзя вызывать вне script setup * как правильно работать с inject...
1 неделю назад
⚡️ Vue 3.5 | Глобальный bootstrap приложения: init, guards, redirect, token | Личный кабинет
Новая часть проекта «Личный кабинет интернет-провайдера» уже на канале 🚀 Сегодня разбираем одну из самых важных архитектурных тем — инициализацию приложения. Показываю, как собрать разрозненную логику старта приложения в единый глобальный bootstrap: инициализация пользователя, установка HTTP-токена, route guards и redirect-логика — в одном управляемом месте. 📌 Что разбираем в этом видео: * что такое bootstrap приложения и зачем он нужен * какие инициализационные процессы есть в реальном проекте * инициализация авторизованного пользователя * установка токена в HTTP-клиенте при старте приложения...
2 недели назад
⚡️ Vue 3.5 + Pinia | Реактивная деструктуризация store + assert function | Личный кабинет
Новая часть проекта «Личный кабинет интернет-провайдера» уже на канале 🚀 Сегодня разбираем две важные и часто недооценённые темы при работе с Pinia и TypeScript: 👉 как не потерять реактивность store при деструктуризации 👉 как и зачем использовать assert function в реальных проектах В этом видео я показываю типичные ошибки, с которыми сталкиваются разработчики, и объясняю, как писать код, который остаётся стабильным и предсказуемым по мере роста проекта. 📌 Что делаем в этом видео: * разбираем, почему store теряет реактивность при обычной деструктуризации * правильно деструктурируем Pinia...
3 недели назад
Всем привет! Хочу поздравить всех с наступающим новым годом
! 🎄 🥳 Пожелать достижение желаемых высот и благополучия Так же хотел поблагодарить той поддержки, которую вы дали - за 5 месяцев нас в этой группе уже 39 человек, да, это не сотни и не тысячи, но все равно, мне кажется хорошо, без какой либо рекламы. Так же на YouTube уже 100 подписчиков и больше двух тысяч просмотров. Спасибо вам, за то, что смотрите...
4 недели назад
⚡️ Vue 3.5 + Pinia | Список счетов пользователя в профиле + архитектура | Личный кабинет
Новая часть проекта «Личный кабинет интернет-провайдера» уже на канале 🚀 Сегодня реализуем вывод списка выставленных счетов пользователя прямо в профиле и разбираем важный архитектурный момент — почему повторяющуюся логику нужно выносить в отдельные абстракции. В этом видео я показываю не просто «как вывести данные», а как писать код, который не развалится по мере роста проекта. 📌 Что делаем в этом видео: * получаем список счетов пользователя с API * выводим инвойсы в профиле пользователя * обрабатываем загрузку и пустые состояния * находим повторяющуюся логику в проекте * выносим общую логику...
1 месяц назад
🌲 Паттерн Компоновщик: как работать с деревьями так же просто, как с листьями
Сегодня разберём паттерн Composite (Компоновщик) — элегантный способ работы с иерархическими структурами. Суть: работаешь с группой объектов точно так же, как с одним объектом. Проблема: дерево объектов, куча if-ов Делаешь файловый менеджер. Нужно посчитать размер выбранного элемента. Первое решение: function calculateSize(item: File | Folder): number { if (item.type === 'file') { return item.size; } else { let totalSize = 0; for (const child of item.children) { if (child.type === 'file') { totalSize += child.size; } else { totalSize += calculateSize(child); // рекурсия } } return totalSize;...
1 месяц назад
⚡️ Vue 3.5 + Pinia | Профиль пользователя: получение и обновление данных | Личный кабинет провайдера
Новая часть проекта «Личный кабинет интернет-провайдера» уже на канале 🚀 Сегодня реализуем страницу профиля авторизованного пользователя — получаем данные с сервера и обновляем имя и адрес. В этом видео я показываю, как на практике выстроить работу с профилем пользователя в production-проекте на Vue 3.5 + TypeScript: от загрузки данных до их обновления и синхронизации с интерфейсом. 📌 Что делаем в этом видео: * получаем данные авторизованного пользователя * реализуем страницу Профиль * заполняем форму данными с API * обновляем имя и адрес пользователя Ты увидишь, как правильно работать с...
1 месяц назад
🧠 Разработчик vs исполнитель кода: почему думающий специалист ценнее
Недавно наткнулся на интересный спор в комментариях под статьёй о профессионализме. Два противоположных подхода к работе: Позиция А: "Если ТЗ составлено нечётко — не буду делать задачу, пока не уточнят все детали" Позиция Б: "Это низкая квалификация. Чем такой разработчик отличается от GPT, которой дай чёткое ТЗ — и она всё сделает?" Звучит как холивар, но давай копнём глубже. Проблема обеих крайностей Представь: к работяге приходит мастер и говорит "сделай балку". Он молча берётся за работу. Через два часа мастер возвращается: — Ну что? — Вот, сделал. А он просто металл с двух сторон обрезал...
1 месяц назад
⚡ Vue 3.5 + VueUse | createEventHook для глобального logout при 401 | Личный кабинет провайдера
⚡ Vue 3.5 + VueUse | createEventHook для глобального logout при 401 | Личный кабинет провайдера Новая часть проекта «Личный кабинет интернет-провайдера» уже на канале 🚀 Сегодня разбираем, как с помощью createEventHook из VueUse централизованно обрабатывать 401 ошибки и автоматически разлогинивать пользователя. В этом видео я показываю, как создать глобальное событие unauthorized, подписаться на него на уровне приложения и внедрить в httpClient для корректного logout. 📌 Что делаем в этом видео: * Разбираемся, что такое createEventHook и зачем он нужен * Создаём глобальное событие unauthorized * Подписываемся на unauthorized...
1 месяц назад
⚡ Vue 3.5 | Выставление счёта пользователю с активной подпиской | Личный кабинет провайдера
⚡ Vue 3.5 | Выставление счёта пользователю с активной подпиской | Личный кабинет провайдера Новая часть проекта «Личный кабинет интернет-провайдера» уже на канале 🚀 Сегодня реализуем одну из ключевых операций billing-системы — выставление счёта конкретному пользователю с активной подпиской. В этом видео я показываю весь процесс от получения списка пользователей до успешного создания инвойса и обновления данных в интерфейсе. Теперь ты увидишь, как на практике реализуется логика выставления счётов в реальном продукте на Vue 3.5 + TypeScript с учётом UX и архитектуры. 📌 Что делаем в этом видео:...
1 месяц назад
⚡ Vue 3.5 + TypeScript — Биллинг, выставление счетов и просмотр инвойсов (Admin Only
⚡ Vue 3.5 + TypeScript — Биллинг, выставление счетов и просмотр инвойсов (Admin Only) Новая часть проекта «Личный кабинет интернет-провайдера» уже на канале! 🚀 Сегодня переходим к одной из самых ключевых функций любого коммерческого веб-продукта — биллингу. Мы реализуем полноценную систему выставления счетов от администратора и отображение всех инвойсов в личном кабинете. Это тот самый функционал, который используют реальные провайдеры, SaaS-сервисы, CRM-системы и любые продукты с подписками и оплатами. Теперь ты увидишь, как правильно построить billing-модуль на Vue 3.5 + TypeScript — с архитектурой уровня продакшена...
1 месяц назад
🏗 Паттерн “Строитель”: когда он нужен, а когда — просто усложняет код
🏗 Паттерн “Строитель”: когда он нужен, а когда — просто усложняет код Многие начинают применять Builder просто потому, что «так красиво» или «видел в чьем-то коде». Давай разберёмся, где он реально решает проблему, а где — избыточен. Что такое Builder? Это паттерн, который помогает создавать сложные объекты пошагово, скрывая детали и делая процесс конструирования более контролируемым. Классика: объект с кучей необязательных полей и сложной логикой инициализации. Когда Builder оправдан? ✅ У объекта много параметров Особенно если часть из них необязательная, а комбинации параметров — разные...
2 месяца назад