Цели курса
Курс посвящён разработке на Vue 3: от использования его как небольшой библиотеки до создания современного SPA приложения.
С первого занятия мы будем разрабатывать проект, на примере которого постепенно изучим возможности Vue.js, основные библиотеки его экосистемы и их применение для решения практических задач.
Как организовано обучение?
Курс идёт примерно 1.5 месяца.
До начала обучения: вводные материалы
За неделю до начала курса вы получите письмо с материалами для подготовки к курсу.
Мы также будем использовать систему Git/GitHub для обмена исходным кодом, так делает большинство проектов. Для тех, кому это в новинку - дадим крэш-курс и поможем разобраться.
Онлайн-занятия с преподавателем 2 раза в неделю
Занятие проходит в формате вебинара. Запись занятия доступна через 15 минут после окончания. Вы также сохраняете доступ к записям после окончания курса.
Домашние задания, обратная связь по ним
Ваши решения присылаете преподавателю, он проверяет качество кода, использование правильных приёмов проектирования, даёт обратную связь.
Чат
Между занятиями доступен групповой чат для общения и вопросов преподавателю.
Курсовой проект
Делаем курсовой проект: сервис организации митапов, большую часть которого Вы реализуете самостоятельено.
Результат
Вы владеете основными возможностями Vue и библиотек его экосистемы.
Вы умеете разрабатывать Vue-компоненты и применять для этого различные подходы.
Вы знакомы с особенностями работы Vue.
Вы можете использовать Vue и как небольшую библиотеку, и для разработки одностраничных приложений.
Сертификат
По окончанию курсов вы получаете сертификат в электронном виде на русском и английском языках.
Хотя сертификатам в нашей профессии обычно не придают значения. Главное - знания и умения, которые вы получите, если будете полноценно участвовать в курсе.
Программа курса
Блок 1
Знакомство с Vue и компонентами
В начале курса мы познакомимся с Vue.js как небольшой библиотекой, использующейся без систем сборки. Изучим основные Vue и разработки компонентов.
- Основные концепции в разработке на Vue.
- Создание Vue приложения.
- Options API.
- Синтаксис шаблона.
- Реактивность, вычисляемые свойства, отслеживание.
- Работа с DOM событиями, атрибутами, элементами форм.
- Хуки жизненного цикла.
- Компонентный подход и описание компонентов на Vue.
- Входные параметры и события компонентов.
- Слоты и именованные слоты компонентов.
Блок 2
Vue во Frontend разработке
Изучив основы, перейдём к современному подходу к разработке JavaScript приложений во Frontend разработке. Познакомимся с различными инструментами разработки во Frontend и Vue. Разберёмся с концепцией одностраничных приложений и научимся создавать из на Vue с Vue Router.
- Инструменты разработки во Frontend: транспайлеры, линтер, сборщики и другие.
- Однофайловые компоненты во Vue (SFC).
- Создание и разработка Vue приложений с Vue CLI.
- Создание и разработка Vue приложений с Vite.
- Одностраничные приложения (SPA).
- Разработка SPA на Vue с Vue Router.
Блок 3
Углубление во Vue
После знакомства с инструментальной частью вернёмся к разработке Vue компонентов, научимся создавать компоненты обёртки и разберёмся с однонаправленным потоком данных в компонентах. В середине курса будем погружаться в работу Vue: подробнее разберёмся, как работает реактивность и используется вне Options API, углубимся в работу рендеринга.
- Компоненты обёртки, динамический компонент.
- Компоненты редактирования данных и однонаправленный поток данных.
- Углубление в реактивность: реализация, ограничения, использование вне Vue компонентов.
- Углубление в рендеринг: Virtual DOM, render-функция, JSX, key, компонент KeepAlive.
Блок 4
Взаимодействие компонентов, Composition API и shared state
Рассмотрим другие варианты взаимодействия Vue компонентов и их применимость в разных задачах. Затем перейдём к вариантам переиспользования кода компонентов в Options API и перейдём на Composition API - новый подход разработки компонентов во Vue 3. С переходом на Composition, посмотрим варианты работы с общим состоянием компонентов и познакомимся с центральными хранилищами Vuex и Pinia.
- Scoped slots.
- Event Bus.
- Teleport.
- Provide/Inject.
- Пользовательские директивы.
- Создание Vue плагинов.
- Переиспользование кода в компонентах, миксины, предпосылки к Composition API.
- Composition API и composables.
- Shared state.
- Центральные хранилища: Vuex, Pinia.
Блок 5
Завершение курса
Когда Vue и использование Vue компонентов уже будут изучены, научимся тестировать их использование с Jest и Vue Test Utils. В конце курса вспомним проблемы SPA и рассмотрим варианты их решения. В завершении перейдём к задачам разработки приложения за пределами Vue компонентов, поговорим об архитектуре приложения и работе с HTTP API.
- Unit-тестирование Vue компонентов с Jest и Vue Test Utils.
- Проблемы SPA и способы их решения: prerendering и server-side rendering.
- Архитектура приложения за пределами Vue.
Курсовой проект
Сервис для "митапов" (собраний, конференций)
- Одностраничное приложение: роутинг, динамическая подгрузка страниц.
- Вывод в виде календаря или списка.
- Работа с формами: компоненты форм, генерация.
- Сетевые запросы, HTTP API, аутентификация.
- Современная архитектура.
Преподаватель
Веб-разработкой занимаюсь с 2014 года, а с Vue начал работать с 2017 года. С 2022 года занимаюсь frontend разработкой платформы общения Nextcloud Talk в компании Nextcloud.
Также давно занимаюсь и преподаванием. Вёл свой курс веб-разработки в университете и 9 лет учу школьников алгоритмам и решению нестандартных задач в лагерях спортивного программирования. Активно участвую в русскоязычных ИТ сообществах.
Что говорят о курсе участники?
Мы занимаемся обучением с 2007 года. За это время у нас обучились тысячи разработчиков из разных стран и компаний.
Все отзывы являются честными. Мы не модерируем их.
Курс регулярно обновляется. Все отзывы относятся к последней версии курса.
Гарантия
- Если объяснения будут вам непонятны
- Если курсы не дадут вам новых знаний и умений
- Если вы не сможете подключиться к системе онлайн-обучения
…то вы сможете получить деньги назад.
Для этого достаточно не позже окончания первой недели курса написать, что именно вас не устраивает, и тогда ваше участие будет прекращено, а вы получите деньги обратно.
Для компаний
У нас большой опыт работы с самыми разными компаниями: как маленькими, так и IT-гигантами (Яндекс, Мейл.ру и другие), а также с бюджетными (Университеты и другие).
- При записи нужно выбрать способ оплаты "счёт на компанию", и документы будут автоматически сгенерированы: договор, акт и счёт.
- Для зарубежных компаний выдаём инвойс на английском языке.
- Физическим лицам даём справку об оплате, если нужна компании для компенсации расходов.
- Сведения о нас (для бухгалтерии): скачать архив с документами.
- У нас есть лицензия
- Можно сделать налоговый вычет при оплате переводом на банковский счёт: детали для РФ
Запись на курс
Если остались вопросы – посмотрите в часто задаваемых, напишите в комментариях внизу этой страницы или на почту help@javascript.ru (ответ обычно в течение дня), а если срочно — задайте по телефону +7-903-5419441.
Комментарии
<code>, для нескольких строк кода — тег<pre>, если больше 10 строк — ссылку на песочницу (plnkr, JSBin, codepen…)