Цели курса
Курс посвящён разработке на Vue.js: от использования его как небольшой библиотеки до создания современного SPA приложения.
С первого занятия мы будем разрабатывать проект, на примере которого постепенно изучим возможности Vue.js, основные библиотеки его экосистемы и их применение для решения практических задач.
Большое количество текущих проектов используют Vue 2. В будущем его место займёт новая версия Vue 3.
Сейчас идёт запись на последнюю группу по Vue 2.
В дальнейшем, с июня, обучение будет уже по версии Vue 3.
Как организовано обучение?
Курс идёт примерно 1.5 месяца.
До начала обучения: вводные материалы
За неделю до начала курса вы получите письмо с материалами для подготовки к курсу.
Мы также будем использовать систему Git/GitHub для обмена исходным кодом, так делает большинство проектов. Для тех, кому это в новинку - дадим крэш-курс и поможем разобраться.
Онлайн-занятия с преподавателем 2 раза в неделю
Занятие проходит в формате вебинара. Запись занятия доступна через 15 минут после окончания. Вы также сохраняете доступ к записям после окончания курса.
Домашние задания, обратная связь по ним
Ваши решения присылаете преподавателю, он проверяет качество кода, использование правильных шаблонов проектирования, даёт обратную связь. К ряду заданий прилагаются тесты, которые частично позволяют проверить правильность решения самому.
Чат
Между занятиями доступен групповой чат для общения и вопросов преподавателю.
Курсовой проект
Делаем курсовой проект: сервис организации митапов. Большую часть кода для проекта пишете вы.
Результат
Вы хорошо понимаете возможности Vue.js и основных библиотек его экосистемы.
Вы умеете разрабатывать компоненты на Vue.js и использовать их как в существующих проектах, так и разрабатывать SPA приложения на Vue.js.
Вы используете различные инструменты разработки современных веб-приложений.
Вы знаете, в каком направлении развиваться дальше.
Сертификат
По окончанию курсов вы получаете сертификат в электронном виде на русском и английском языках.
Хотя сертификатам в нашей профессии обычно не придают значения. Главное - знания и умения, которые вы получите, если будете полноценно участвовать в курсе.
Программа по занятиям
Блок 1
Знакомство с Vue.js
В начале курса мы познакомимся с Vue.js как небольшой библиотекой, изучим её основными возможности и их применение в компонентном подходе к разработке приложений.
Основы Vue.js
- Шаблоны Vue.js
- Реактивность во Vue.js, вычисляемые свойства, отслеживание изменений
- Обработка событий
- Работа с формами
- Анимации
- Хуки жизненного цикла
Компоненты во Vue.js
- Компонентный подход
- Создание компонентов
- Взаимодействие компонентов во Vue 2 и Vue 3
- Слоты
Блок 2
Разработка приложений на Vue.js
Перейдём к современному подходу к разработке JavaScript приложений и научимся создавать одностраничные приложения на Vue.js.
Сборка приложения
- Организация сборки, инструменты
- Однофайловые компоненты
- Scoped styles
- Конфигурирование webpack для разработки на Vue.js
Vue CLI
- Создание приложений с @vue/cli
- Разработка и сборка приложения через vue-cli-service
- Конфигурирование сборки и приложения
Разработка одностраничных приложений на Vue.js
- Одностраничные приложения (SPA), отличия от традиционных веб-приложений
- Маршрутизация на клиенте, vue-router
- Параметризированные и вложенные маршруты
- Взаимодействие с API, получение данных на маршрутах
Тестирование
- Что такое тестирование
- Unit-тестирование с Jest
- Тестирование Vue.js приложения с Jest и vue-test-utils
Блок 3
Углубление во Vue.js и разработку компонентов
Углубимся во Vue.js, разберёмся, как работает реактивность и Virtual DOM, какие есть ограничения при разработке на Vue.js. Рассмотрим некоторые подходы к разработке компонентов.
- Как реализована реактивность и как с ней правильно работать
- Vue.observable и reactive
- Virtual DOM во Vue.js и что важно знать при работе с ним
- Рендер-функция
- Ограничения Vue.js и работа с другими библиотеками
- Динамические компоненты
- Компоненты формы и unidirectional data flow
Блок 4
Расширение Vue.js и переиспользование логики
Разберём ещё несколько способов взаимодействия компонентов. Научимся расширять Vue.js и переиспользовать логику. Изучим Composition API из Vue 3.
- Особые способы взаимодействия компонентов
- Шина событий и способы её реализации
- Библиотека portal-vue и Teleport из Vue 3
- Где и как можно хранить глобальные данные в приложении
- Provide / Inject во Vue 2 и Vue 3
- Scoped Slots
- Пользовательские директивы
- Миксины
- Плагины
- Vue 3 Composition API
Блок 5
Vuex и архитектурные аспекты проекта
Разберёмся с концепцией Flux и библиотекой Vuex. Рассмотрим различные аспекты разработки приложения на уровне проекта.
- Паттерн Flux: зачем он нужен и его реализация с библиотекой vuex
- Модули во vuex
- Работа с формами во vuex
- Архитектура приложения и организация работы с API
- Обработка ошибок
- Некоторые паттерны компонентов
- Router Guards
- Аутентификация
Блок 6
Куда развиваться дальше
Проблемы SPA и способы их решения: сравним prerendering и server-side rendering, проведём краткий обзор фреймворка Nuxt.js.
Дополнительные темы по вашим вопросам и пожеланиям.
Курсовой проект
Сервис для "митапов" (собраний, конференций)
- Одностраничное приложение: роутинг, динамическая подгрузка страниц.
- Вывод в виде календаря или списка.
- Работа с формами: генерация, управлеине, свои интерфейсы.
- Запросы к серверному API.
- Ряд других графических компонент.
- Современная архитектура.
Преподаватель

Веб-разработкой занимаюсь с 2014 года, с Vue.js начал работать с 2017 года. Сейчас занимаюсь разработкой внутренних приложений для компании Lukoil на Vue.js.
Также давно занимаюсь преподаванием. Веду свой курс веб-разработки в университете и несколько лет обучаю олимпиадному и промышленному программированию. Активно участвую в русскоязычных ИТ сообществах.
Гарантия
- Если объяснения будут вам непонятны
- Если курсы не дадут вам новых знаний и умений
- Если вы не сможете подключиться к системе онлайн-обучения
…то вы сможете получить деньги назад.
Для этого достаточно не позже окончания первой недели курса написать, указав причину из этого списка и что именно вас не устраивает, и тогда ваше участие будет прекращено, а вы получите деньги обратно.
Для компаний
У нас большой опыт работы с самыми разными компаниями: как маленькими, так и IT-гигантами (Яндекс, Мейл.ру и другие).
- При записи нужно выбрать способ оплаты "счёт на компанию", и документы будут автоматически сгенерированы: договор, акт и счёт.
- Для зарубежных компаний выдаём инвойс на английском языке.
- Физическим лицам даём справку об оплате, если нужна компании для компенсации расходов.
- Сведения о нас (для бухгалтерии): скачать архив с документами.
- У нас есть лицензия
- Можно сделать налоговый вычет: детали для России
Комментарии
<code>
, для нескольких строк кода — тег<pre>
, если больше 10 строк — ссылку на песочницу (plnkr, JSBin, codepen…)