Курс по разработке веб-приложений на Vue.js практический курс без воды

Для frontend-разработчиков  и верстальщиков уровня Junior и Middle. Разработка веб-приложений на фреймворке Vue.js, с применением Vuex, VueRouter, vue-cli и nuxt.js. Оффлайн обучение в центре Санкт-Петербурга!

Курс входит в состав профессии Frontend-разработчик.
64
ак. часа
8-10
человек в группе
16
занятий
30 сентября
старт группы
Запишитесь на курс сейчас –
первое занятие уже 30 сентября

Ключевые темы курса

Vue и экосистема:

  • Фреймворк Vue.js
  • Vue CLI (+UI)
  • VueRouter
  • Vuex
  • VueLoader
  • Server Side Rendering (SSR)
  • nuxt.js
  • Vuetify.js
  • Vue Dev Tools

Теория:

  • Особенности реактивной системы Vue.js
  • Декларативный синтаксис в шаблонах
  • Вычисляемые свойства, отслеживание
  • Хуки жизненного цикла, навигационные хуки
  • Событийная система Vue и кастомные события
  • Организация двустороннего потока данных
  • Управление состоянием и архитектура приложения
  • Компоненты, слоты, область видимости шаблона, пропсы
  • Однофайловые компоненты
  • Динамические компоненты
  • Миксины
  • Рендер-функции и JSX
  • Кастомные директивы
Практика:

  • Построение SPA на Vue.js с применением Vuex и Vue Router
  • Прелоадеры, анимация
  • Разработка компонентов
  • Разработка приложения с компонентами vuetify
  • Валидация форм с vuelidate и vee-validate
  • Оптимизация приложения на Vue.js
  • Асинхронные компоненты
  • Модульное тестирование компонентов Vue.js
  • Развёртывание приложения в облака
  • BaaS на примере Firebase
  • Разработка изоморфного приложения
Сертификат
По итогам ты получишь яркий сертификат!

Подробная программа курса

Для каждого урока есть список теоретических тем и практических упражнений, а также итоги занятия.
Модуль 1

Фреймворк Vue.js

Занятие 1. Основы Vue.js

Изучаем декларативный подход и особенности шаблонизатора Vue.js

  • Основы Vue.js
  • Отличия сборок
  • Декларативный стиль в разметке
  • Реактивное обновление данных
  • Основные директивы
  • Отрисовка списков

Занятие 2. Формы и модели

Учимся использовать Vue.js для валидации и обработки форм

  • Реактивность в формах
  • Обработка событий
  • Отслеживаемые свойства
  • Вычисляемые свойства

Занятие 3. Компоненты

Декомпозиция задачи, особенности компонентов Vue.js

  • Кастомные элементы
  • Создание компонентов
  • Входные параметры
  • Обработка событий у компонентов
  • Нюансы отрисовки

 

Занятие 4. Однофайловые компоненты (SFC)

Используем Babel и Webpack для сборки приложения из однофайловых компонентов

  • Single File Components
  • Сборка приложения с webpack и babel
  • Конфигурация webpack для удобной разработки
  • Практика по разработке и переиспользованию компонент
  • BEM и компонентный подход к разметке
Модуль 2

Разработка SPA

Занятие 5. Одностраничные приложения (SPA)

Особенности SPA во Vue.js, применение Vue Router

  • Основы SPA
  • Архитектура приложения
  • Vue Router
  • Практика по разработке приложения
  • Прелоадер

Занятие 6. Vue-cli

Учимся использовать консольную утилиту для ускорения разработки

  • Автоматизация разработки с vue-cli
  • Быстрое развёртывание проекта
  • Дополнительные инструменты
  • Практика

Занятие 7. Взаимодействие с API

Осваиваем особенности взаимодействия с бэкендом и веб-сервисами на Vue.js

  • Axios.js
  • Взаимодействие с бэкендом
  • Знакомство с firebase
  • Кеширование и организация данных

Занятие 8. Vuex

Управляем состоянием приложения через хранилище Vuex

  • Основы Vuex
  • Работа с хранилищем
  • Геттеры и мутации
  • Структура приложения
  • Vuex и формы

Занятие 9. Практическое занятие

Продолжаем работу над проектом

  • Практика по разработке SPA на Vue.js
  • Самостоятельная работа
  • Применение анимаций
  • Асинхронная подгрузка компонент

Занятие 10. Модульное тестирование

Про TDD и тестирование компонентов

  • Тестирование компонентов
  • Mocha.js
  • Введение в TDD
  • Практика по TDD
  • Coverage и оценка покрытия
Модуль 3

SSR

Занятие 11. Отрисовка на стороне сервера (SSR) и пререндеринг

Основы SSR, знакомство с фреймворком nuxt.js

  • Пререндеринг и SSR
  • Когда нужна отрисовка на сервере
  • Практика по пререндерингу
  • Знакомтсво с nuxt.js

Занятие 12. Nuxt.js

Разработка приложений на nuxt.js (высокоуровневый фреймворк на базе Vue.js)

  • Особенности nuxt.js
  • Разработка SPA с поддержкой SSR
  • Генерация статического сайта
  • Деплой на Git pages
Модуль 4

Практикум

Занятие 13. Практическое занятие

Отработка материала, работа над собственным проектом

  • Работа над личным проектом
  • Практика по разработке приложения по TDD
  • Реализация тестов
  • Разбор сложных вопросов

Занятие 14. Практическое занятие

Отработка материала, работа над собственным проектом

  • Работа над личным проектом
  • Практика по разработке приложения по TDD
  • Реализация тестов
  • Разбор сложных вопросов

Занятие 15. Практическое занятие

Отработка материала, работа над собственным проектом

  • Работа над личным проектом
  • Практика по разработке приложения по TDD
  • Реализация тестов
  • Разбор сложных вопросов

Занятие 16. Выпускной

Защита личных проектов, подведение итогов курса, повторение материала

  • Защита личного проекта
  • Финальный код-ревью
  • Повторение материала
  • Подведение итогов
Подробный план занятия
/home/student/module_1/lesson_1>
  • Основы Vue.js
  • Отличия сборок
  • Декларативный стиль в разметке
  • Реактивное обновление данных
  • Основные директивы
  • Отрисовка списков

Сколько стоит прохождение курса?

Максимальный
  • Очное прохождение курса
  • Рабочее место за нашим ноутбуком (по желанию)
  • Учебные материалы
  • Онлайн-чат с преподавателем
  • Лицензионная копия программ JetBrains
  • Проверка домашних заданий и code-review
  • Help-day по средам
  • Гарантия трудоустройства (при освоении профессии)
  • 2 индивидуальных занятия с преподавателем
  • Дополнительные индивидуально подобранные задания
  • Возможность работать над личным проектом с помощью преподавателя
39 900 руб.
27 900 руб.
Скидка 30% действует до 15 сентября
Оптимальный
  • Очное прохождение курса
  • Рабочее место за нашим ноутбуком (по желанию)
  • Учебные материалы
  • Онлайн-чат с преподавателем
  • Лицензионная копия программ JetBrains
  • Проверка домашних заданий и code-review
  • Help-day по средам
  • Гарантия трудоустройства (при освоении профессии)
  • 2 индивидуальных занятия с преподавателем
  • Дополнительные индивидуально подобранные задания
  • Возможность работать над личным проектом с помощью преподавателя
33 900 руб.
23 700 руб.
Скидка 30% действует до 15 сентября
Стартовый
  • Очное прохождение курса
  • Рабочее место за нашим ноутбуком (по желанию)
  • Учебные материалы
  • Онлайн-чат с преподавателем
  • Лицензионная копия программ JetBrains
  • Проверка домашних заданий и code-review
  • Help-day по средам
  • Гарантия трудоустройства (при освоении профессии)
  • 2 индивидуальных занятия с преподавателем
  • Дополнительные индивидуально подобранные задания
  • Возможность работать над личным проектом с помощью преподавателя
27 900 руб.
19 500 руб.
Скидка 30% действует до 15 сентября
* Во все тарифы включена услуга «помощь с трудоустройством выпускников»:
  • Помощь с написанием резюме
  • Тестовое собеседование
  • Помощь в поиске вакансии

Получи персональную скидку!

Узнай окончательную стоимость с учётом персональных скидок

Запишись на курс заранее

Забронируй место в группе за месяц до начала занятий и получи скидку.

Поделись информацией о курсе в соц.сетях

Сделай пост в ВК или в Instagram о том, что идёшь к нам на курсы.

Вместе дешевле! Приходи с друзьями

Приходи на курс с другом или родственником — каждый получит скидку.

Оплати весь курс целиком

Оплати стоимость курса целиком. Это дешевле.

Забронируй несколько курсов

На каждый последующий курс предоставляется накопительная скидка!
Оставь заявку, чтобы получить персональную скидку на курс.
Узнай окончательную стоимость с учётом персональной скидки

Расписание занятий

Группа
Расписание
Время занятий
Вечерняя группа по будням
Начало с 30 сентября
Пн
Вт
Ср
Чт
Пт
Сб
Вс
19:00 — 22:00
Интересует другое расписание?
Узнайте о новых группах и индивидуальных занятиях у администратора по телефону 8 (812) 914-88-40.

Преподаватели

Мы трепетно относимся к нашим преподавателям, приглашаем вести занятия только опытных специалистов-практиков, тренируем и обучаем их, чтобы гарантировать высокое и стабильное качество подачи материала.
Юрий Горин
Юрий Горин
Fullstack Web Developer с 10-летним опытом по профессии, преподаватель с 5-летним стажем, методист

Уже 5 лет мне удаётся совмещать работу программистом с успешной преподавательской деятельностью. За эти годы я обучил и выпустил более 400 человек, многие из которых успешно смогли реализовать себя в IT-индустрии.

В учебном центре «Дверь в АйТи» я занимаюсь разработкой учебных программ, подготовкой преподавателей, а также сам веду занятия, при этом продолжаю работать по специальности.

Основной стек технологий:

  • Node.js / express.js
  • PHP 7+ / Laravel / MySQL
  • JavaScript / ES6+ / Vue.js
  • CSS / SCSS / BEM

На занятиях я всегда стараюсь донести актуальные технологии и знания, но при этом сделать материал простым, понятным и доступным.

https://vk.com/id2005521
Юрий Горин
Роман Ермилов
Team lead front-end developer в компании GrowFood. Опыт разработки коммерческих веб-приложений 10 лет

Разрабатывал ERP систему для завода компании luxottica. Самые известные бренды компании Ray-Ban, Prada, Persol и Oakley. Разрабатывал front-end для международной компании по производству солнечных батарей нового поколения Neosun Energy.

С нуля делал полностью автоматизированные сервисы по аналитике и продаже лайков в Instagram. Очень много закрытых соглашением о неразглашении коммерческих проектов, о которых хочется, но невозможно рассказать (для заказчиков из ОАЭ, России и США)

С 2016 года работаю Team lead front-end developer в компании GrowFood.

Также занимаюсь организацией и проведением мастер-классов по front-end разработке, где мы со студентами погружаемся в профессию и начинаем верстать и разрабатывать приложения с нуля.

Основной стек технологий:

  • JavaScript
  • Vue.js
  • Webpack
  • HTML & CSS
  • SCSS
https://vk.com/ermilov.roman

Спросите преподавателя!

Задайте вопрос преподавателю совершенно бесплатно

Консультация может быть вам полезна, если:

  • Вы уже знаете часть материала и не уверены, подходит ли вам курс
  • Вы не уверены, что у вас хватит базовых знаний для прохождения курса
  • Вы уже изучали что-то самостоятельно, но у вас возникли сложности
Заявка на консультацию
Оставьте заявку на консультацию с преподавателем по телефону или лично в учебном центре

Отзывы наших учеников

Хочу отметить доступность, с которой подается материал
Содержательно, а что самое главное, так это актуальность информации. Также хочу отметить доступность, с которой подается материал — каждый пункт объясняется и резюмируется, поэтому если что-то было не понятно — будет вкратце обговорено еще раз.

Скажу честно, было сложновато учиться из-за работы и тотальной нехватки времени. Много практических заданий, помогающих закрепить и понять материал.
Общение в онлайн-чате и дополнительный материал сильно помогают. В общем — всё отлично!
Клим Бочарников
Хочу поблагодарить за грамотную и последовательную подачу информации
Курс действительно очень полезный, поскольку рассматриваются актуальные и наиболее широко используемые в данный момент приемы верстки, принципы работы с макетами, а также возможные проблемы и способы и решения.

Лично от себя хочу поблагодарить Юрия за грамотную и последовательную подачу информации, умение передать суть того или иного приема или метода, а также за постоянную обратную связь и грамотно подобранные домашние задания, позволяющие на практике самостоятельно отработать и закрепить полученные знания.
Артем Прокопенко
Курс у меня совпал со стажировкой-работой на должности frontend разработчика в своей компании
Впечатления от курса самые прекрасные) Очень важно, когда преподаватель, по-настоящему, хочет научить, всегда готов помочь, делится теоретическими знаниями и практическим опытом, проверенными в собственной работе.

Так как данный курс у меня совпал со стажировкой-работой на должности frontend разработчика в своей компании, кое что сразу смотрела и применяла в работе на практике, кое-что сравнивала, домашние, к сожалению, делать не успевала…((
С нетерпением жду углубленных курсов по JS и PHP, надеюсь будет и по Seo.
Юлия Ичетовкина
Проба реальных проектов создает в голове целостную картину всей разработки
Проходя этот курс я уже работал в этой сфере и могу с уверенностью сказать, конкретно этот курс оказался очень информативным и полезным, он поднимает уровень на новую ступень именно профессиональной верстки. А проба реальных проектов (пусть и учебных, но всё же реальных) создает в голове целостную картину всей разработки. Каждое занятие новый интересный материал, курс пролетел очень быстро!!!
Я обязательно продолжу обучение!
Юрий, огромное спасибо!
Любомир Долгополов

Ответы на частые вопросы

Кто ведёт занятия? Что у вас за преподаватели?

Все наши преподаватели — практикующие специалисты: программисты, веб-разработчики, дизайнеры. Они — профессионалы своего дела, которые готовы поделиться своим опытом и знаниями с начинающими специалистами.

Мы обучаем наших преподавателей тонкостям образовательного процесса, а за качеством их работы всегда следит методист.

Возможны ли индивидуальные занятия по курсу?

Да, у нас есть индивидуальные занятия. Как правило, при общении один на один с преподавателем можно освоить материал гораздо быстрее и эффективнее, чем в группе.

Ты можешь пройти индивидуально как весь курс целиком, так и отдельные интересующие темы.

Узнать подробности об индивидуальных занятиях можно у наших администраторов по телефону 8 (812) 914-88-40.

Что делать, если мне не понравилось у вас?

Если вам что-то не понравилось, обязательно сообщите нашему администратору. Мы будем очень расстроены, но постараемся решить возникшие разногласия. В крайнем случае — вернём деньги согласно условиям договора.

Хватит ли заявленного времени в программе для освоения материала?

Да, программы курсов спланированы и отработаны, поэтому вы точно успеете освоить весь заявленный план курса. Главное: слушайте преподавателя, старайтесь выполнять все домашние работы и изучать дополнительный материал.

Ну, а если что-то вдруг пойдёт не так — мы предлагаем бесплатное повторное прохождение курса.

У вас нет нужного мне курса...

Если нужного вам курса сейчас нет в нашем каталоге, это ещё не означает, что мы не можем вам дать нужные навыки и знания.

Свяжитесь с нашим администратором — мы вместе что-нибудь придумаем.

Мне попадалась реклама более дешевых курсов...

Возможно где-то и дешевле, но у нас вы получите гораздо больше:

  • Занятия ведут опытные преподаватели-практики;
  • Программы курсов всё время обновляются, чтобы соответствовать требованиям работодателей;
  • Вы получаете финансовую гарантию трудоустройства, которая прописана в договоре;
  • Мы помогаем с трудоустройством не на словах, а на деле: с поиском вакансий, с написанием резюме, с подготовкой к собеседованиям;
  • У вас есть возможность безлимитно пожизненно пользоваться консультациями преподавателей в рамках help day (на тарифах Максимальный и Оптимальный).
А можно скидку?

Можно, выбирайте из действующих акций и специальных предложений.

Какой график работы в учебном центре?

Мы работаем семь дней в неделю. По будням — с 13:15 до 22:15, а по выходным с 9:30 до 22:30. Приходите! :)

Будет ли сертификат по окончании курса?

Разумеется, каждый ученик, освоивший всю программу курса, получит красивый сертификат, который с гордостью можно приложить к своему резюме :)