udemy
Udemy - одна из самых больших площадок в мире по доставке обучающего контента от разных авторов всего мира. Присутсвуют курсы практически на любую тему.
Продвинутая разработка тем Shopify: Liquid + Vue.js (v3.0)
Advanced Shopify Theme Development: Liquid + Vue.js (v3.0)
★5 (всего оценок - 5)
Продолжительность
6 ч 37 мин
Категория
ShopifyКоличество уроков
32 Видео
Дата добавления
22 июн. 2023 г., 01:22
Язык
Английский
Дата выхода
8 сент. 2021 г., 01:00
Дата обновления
29 апр. 2026 г., 18:10
Хотите создавать современные, высокопроизводительные темы Shopify без устаревших подходов и лишних зависимостей? В этом курсе вы освоите Liquid, JavaScript и Vue.js 3.0, чтобы создавать быстрые, гибкие и масштабируемые темы, соответствующие актуальным требованиям электронной коммерции.
О курсе
Этот курс научит вас создавать профессиональные темы Shopify с нуля, применяя передовые методы разработки без использования jQuery. Вместо устаревших технологий вы будете работать с Vue.js — современным фреймворком, который легко интегрируется в Shopify и обеспечивает высокую скорость, динамичность и гибкость функционала.
Что делает курс уникальным
- От полного нуля до продвинутой темы Shopify
- Глубокое понимание Liquid и шаблонизации
- Использование Vue.js 3.0 для ключевых интерфейсных элементов
- Работа с Shopify Ajax API для динамического обновления контента
- Создание функциональных компонентов без тяжелых зависимостей
Что вы создадите
В ходе обучения вы разработаете полноценную тему Shopify, построенную по современным стандартам качества. Применяемая структура и методология позволяют достичь выдающейся производительности и минимизировать затраты на дальнейшее обслуживание.
Ключевые практические результаты
- Полностью рабочая тема Shopify — с архитектурой, готовой к масштабированию
- Продвинутые элементы на Liquid — улучшенные шаблоны, динамический вывод данных
- Мини-корзина на Vue.js — быстрая, отзывчивая и удобная для пользователя
- Кастомный выбор вариантов — улучшенный UX для карточки товара
- Понимание Shopify Ajax API — работа с динамическими данными без перезагрузки страницы
Почему стоит использовать Vue.js в темах Shopify
Vue.js идеально подходит для разработки кастомных элементов интерфейса именно в Shopify. Он:
- легко интегрируется через CDN, без сложной сборки
- не конфликтует с Liquid и встроенными механизмами Shopify
- позволяет использовать реактивность только там, где это действительно нужно
- обеспечивает высокую скорость работы и стабильность
- облегчает управление состоянием темы
Где Vue.js даёт максимальный эффект
- мини-корзина и динамические обновления корзины
- селекторы вариантов товаров
- фильтрация и сортировка в коллекциях
- динамические виджеты и всплывающие элементы
Для кого этот курс
- Для начинающих разработчиков — можно стартовать без опыта
- Для фрилансеров — чтобы создавать современные темы для клиентов
- Для разработчиков Shopify — чтобы уйти от jQuery и улучшить свои проекты
- Для предпринимателей — чтобы создать собственную высококлассную тему
Итог
Этот курс — ваш путь к созданию современных, быстрых и гибких тем Shopify с использованием Liquid, JavaScript и Vue.js 3.0. Вы научитесь создавать темы, которые выделяются среди конкурентов и обеспечивают покупателям лучший опыт.
Это пробный урок. Оформите подписку, чтобы получить доступ ко всем материалам курса. Премиум
- Урок 1. 00:04:40What we will be building
- Урок 2. 00:05:46Inspiration
- Урок 3. 00:02:27Shopify Partners Account and Online Store
- Урок 4. 00:09:12Theme Kit Connection
- Урок 5. 00:05:17Why Vue.js?
- Урок 6. 00:04:02Adding Products and Collections
- Урок 7. 00:09:04Collection Page
- Урок 8. 00:10:58Homepage Section Schema
- Урок 9. 00:09:33Product Page
- Урок 10. 00:09:33Adding Vue.js to Product Page
- Урок 11. 00:12:23Adding to Cart with Vue.js
- Урок 12. 00:28:46Custom Select Dropdown
- Урок 13. 00:11:10Product Page Styling Basics
- Урок 14. 00:22:52Styling Header and presets
- Урок 15. 00:21:05Collection Page Styling
- Урок 16. 00:15:39Product Card Styling
- Урок 17. 00:21:46Product Page Styling
- Урок 18. 00:21:50Mini-Cart Setup
- Урок 19. 00:23:11Mini-Cart Styling
- Урок 20. 00:25:43Mini-Cart Final Functionality
- Урок 21. 00:14:39Hero Image and Rich Text Sections
- Урок 22. 00:12:21Image with Text Section
- Урок 23. 00:14:17Logo List Section (Section Blocks)
- Урок 24. 00:15:12Menu Drawer
- Урок 25. 00:16:24Footer Menu and Styling
- Урок 26. 00:09:35Menu Interactions
- Урок 27. 00:20:16Mobile Responsiveness
- Урок 28. 00:02:41Next Steps
- Урок 29. 00:00:28Introduction
- Урок 30. 00:08:09Custom Job Boards
- Урок 31. 00:04:03Social Networks
- Урок 32. 00:04:47Slack Groups
Автор - udemy
Комментарии