Vue 3 для начинающих Разработка интернетмагазина Vue Sneakers

>> YOUR LINK HERE: ___ http://youtube.com/watch?v=U_-Ht_v-oAs

Наконец-то доделал курс по Vue 3 для начинающих, в котором мы будем разрабатывать полноценный проект Vue Sneakers (старый добрый React Sneakers, но улучшенный в плане дизайна, анимации и функционала) + хранить данные будем на бесплатном сервисе Mokky. • 🧐 Для кого этот курс? • Курс предназначен для НАЧИНАЮЩИХ 👨🏻‍🎓, кто не знаком с Vue. Для ноченающех! Не для тру фронтенд девелоперов с опытом в 150 лет и познавших вселенную фронтенда, а для простых смертных. • Для тех, кто вообще не знаком с Vue и хочет понять, что это за фреймворк и как на нём создавать реальные приложения с передачей данных между компонентами, роутингом, запросами к бэкенду, а не просто тудушки. • В этом курсе мы не просто будем изучать Vue, но и разрабатывать приложение с роутингом, запросами на бэк, передачей данных между приложением, анимациями, изучим что такое Composition API / Options API и т.д. • ⏬ Мы поймём: • Как работает Vue • Научимся передавать данные между компонентами • Делать запросы на бэк и обрабатывать JSON-данные • Как делать переход между страницами с помощью Vue Router • Как стилизировать приложение с помощью TailwindCSS • Как сделать красивую и простую анимацию списков товаров, корзину и т.п. • ⚙️ Стэк технологий: • Vue 3 • Vue Router • TailwindCSS • Axios • @formkit/auto-animate • Composition API / Options API • ESLint • Prettier • 💾 Ссылка на исходник и дизайн: https://t.me/archakovblog/586 • 🎉 Как задеплоить Vue Sneakers: • Как задеплоить фронтенд проект на Ver... • 👟 Ссылка на JSON-товаров: https://604781a0efa572c1.mokky.dev/items • 🔗 Ссылки на мои ресурсы: • — Telegram-канал: https://t.me/archakov_im • — Поддержать донатом: https://boosty.to/archakov_blog • — VK: https://vk.com/archakov_im • — Личный блог: https://archakov.im • — GitHub: https://github.com/Archakov06 • — Моё резюме: https://career.habr.com/archakovim • ⏰ Таймкоды: • 00:00:00 Введение • 00:11:27 Подготавливаем окружение среды разработки • 00:15:40 Создание и разбор стартового проекта • 00:25:00 Пробуем написать свой код на Vue • 00:37:50 Что такое Options API на примере счётчика • 00:41:50 Переделываем на Composition API • 00:53:50 Как прокинуть данные в компонент • 01:05:05 Начинаем разработку проекта / Установка TailwindCSS • 01:11:45 Изучаем дизайн приложения • 01:17:20 Вёрстка шапки (Header) • 01:43:00 Вёрстка карточки товара и списка (Card + CardList) • 02:14:40 Вёрстка корзины (Drawer) • 02:47:43 Разработка поиска + фильтрация товаров (вёрстка + функционал) • 02:56:30 Используем сервис MOKKY.DEV для хранения данных • 03:50:00 Разработка закладок • 04:08:30 Как прокидывать данные между компонентами без пропсов (provide / inject) • 04:51:00 Разработка функционала корзины (открытие, добавление товаров, создание заказа) • 06:11:35 Прикручиваем анимацию в приложении (auto-animate) • 06:19:10 Подключаем Vue Router • 06:45:23 Делаем отдельную страницу закладок • 07:12:30 Доделываем корзин / Статус: Заказ офомлен • 07:26:30 Подводим итоги

#############################

New on site