Курс по Vue.js 3
С нуля до результата

Записывайтесь и овладейте новой версией трендового фреймворка, и получите 11 проетов в портфолио.

  • Новый курс Только актуальная и свежая информация по вью 3
  • Смотрите в любое время Более 90 уже записанных видео, минимум теории и максимум практики
  • Доступ к курсу Навсегда
  • Бонус: второй курс в подарок Более 300 видео по вью 2 будут добавлены на аккаунт бесплатно и навсегда
Записаться на курс
-46% ~18 ч.
Курс по Vue.js 3
В курс включено:
  • Домашние задания Пять домашних работ, рекомендации и консультации на всех этапах
  • Кейсы и проекты 11 выпускных проекта для вашего портфолио и GitHub
  • Доступ к общему чату Чат со всеми участниками и кураторами курса
  • Сертификат Именной сертификат по окончании курса

Чему вы научитесь

  • 1.
    Composition API

    Самое значительное нововведение новой версии это Composition API. Вы также изучите Options API тк на курсе мы будем писать код в Options и Composition API.

  • 2.
    REST API

    На API строится весь современный веб. Рассмотрим, как хранить и взаимодействовать с данными по REST API, как отдавать и принимать запросы.

  • 3.
    UI и компоненты

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

  • 4.
    Vuex

    Actions, Mutations, State, Getters - все для правильного храненения данных и их дальнейшего взаимодействия.

  • 5.
    Переиспользование

    Зачем писать код дважды? Научимся писать универсальные компоненты, которые можно будет переиспользовать в любых проектах.

  • 6.
    Библиотки

    Помимо стека vue-приложений, мы пройдемся по основным библиотекам и технологиям, которые помогут в создании больших приложений.

  • 7.
    Оптимизация

    Правильный подход к оптимизации на начальном этапе значительно упрощает работу. Научимся понимать, когда нужна оптимизация и как ее применять.

Отзывы

Больше отзывов в нашей группе Вконтакте. Вы всегда можете написать ребятам и задать любой вопрос про обучение. Вот некоторые из отзывов:

Смотреть все отзывы
  • Отзыв от Иван | Tocode
    Иван

    Курс отличный. Материал преподносят структурировано и по делу:

    • Сотни видеоуроков;
    • Домашние работы и детальное ревью с кучей рекомендаций;
    • Прогресс, статистика и прочие плюшки по типу ачивок, которые мне очень понравились;
    • Чат с участниками и кураторами, всегда можно получить помощь оперативно;
    • Подробные статьи и методички ко всем видео;
    • В общем все, что нужно, чтобы на отлично освоить этот фремворк и пройти курс.

    Всем желающим изучить вью 3, в том числе и вторую версию, настоятельно рекомендую этот курс! Особенно понравился модуль с TypeScript + options и composition API.

  • Отзыв от Эльдар | Tocode
    Эльдар

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

    Материал очень доступно преподнес и при этом очень грамотно. Во время обучения очень чутко отслеживается обратная связь со всеми учениками, что так же радует. В курсе рассматривается, как организовать портфолио вплоть до того, как загрузить их на гитхаб, что написать в описании, как происходит рекрутинг. Если не хотите потратить кучу месяцев на изучение основ и практики, то курс то что надо тк поможет найти работу уже через месяц, а 10+ проектов в портфолио вам в этом помогут.

  • Отзыв от Ирина | Tocode
    Ирина

    Изучаю курс Vue 3. Курс разбит на модули, в которых структурированы небольшие видео (до 20 минут) с заголовками темы видео, т.е. легко ориентироваться, если хочешь вернуться и пересмотреть материал. В модулях есть домашки на закрепление материала и с обратной связью разбора дз. Евгений доходчиво объясняет написание кода и под видео письменно обращает внимание на важные вещи. Курсом пока довольна.

  • Отзыв от Екатерина | Tocode
    Екатерина

    Курс очень понравился, очень хорошо подтянул знания по JS (хоть курс и по вью 3), закрыл все пробелы, научилась применять новый синтаксис Composition API и привыкла к нему.

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

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

  • Отзыв от Сергей | Tocode
    Сергей

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

  • Отзыв от Алексей | Tocode
    Алексей

    Хороший курс, достаточно практики. Понравилась подача материала и развернутые ответы на выполненные домашки, где говорилось что можно улучшить. Так же очень хорошо зашли бонусные видео Твитер, где полностью приложение написано на Composition API.

  • Отзыв от Игорь | Tocode
    Игорь

    Отличная подача материала, затрагиваются все актуальные темы, большинство вопросов "что и как" отпадает по ходу просмотра курса). Очень радует разбор материала на реальных примерах.

  • Отзыв от Алексей | Tocode
    Алексей

    Хороший и максимально практический курс, без воды. Особенно порадовал содержательный фидбек по домашкам)

  • Отзыв от Усман | Tocode
    Усман

    Приобрел курс Vue.js 3 . Как и было обещано, получил курс по Vue2 бесплатно. Радует подача материала без воды, упор в основном делается на практику, получаешь доступ в общий чат, где получаешь оперативную обратную связь на интересующий вопрос. К модулям прилагаются домашки и доп. материал. Изучаю и пока что доволен.

80 000₽

Средняя зарплата Frontend разработчика по РФ

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

Согласно hh, SuperJob и Яндекс работа, где собирались данные о вакансиях - это средняя зарплата vue.js разработчика. В данной выборке не участвовали города миллионники.
Поэтому в Москве, Санкт-Петербурге и других городах-миллионниках она может быть выше (иногда в 2 - 3 раза).

Программа курса

#1 Видеоуроки ~50м.

Основы Vue.js 3

Основные моменты и нововведения в vue.js 3

  • - Про визуальные фреймворки или почему важно писать все самому
  • - Разница между Vue.js и React.js
  • - Новые возможности Vue.js 3
  • - Сравнение Vue.js 3 и Vue.js 2
  • - Work Flow - Настройка редактора
  • - Work Flow - Настройка необходимых плагинов
  • - Work Flow - Настройка конфигов
  • - Work Flow - Code style
  • - Инициализация vue.js
  • - Mount на идентификатор
  • - Динамическая смена данных в data
  • - Работа с объектами
  • - Methods и их применение
  • - Вычисляемые свойства - Computed
  • - Работа с Boolean значениями
  • - Дериктива v-if - условные реднеринг
  • - Привязка атрибутов через v-bind
  • - Применение v-model
  • - Циклы и вывод больших списков
  • - Хуки жизненного цикла вью компонентов
#2 Видеоуроки ~1ч. 20м.

Приложение с заметками

Напишем заметочник, где применим все знания из "Основы Vue.js 3"

  • - Компонентный подход
  • - Интерполяция
  • - Вывод HTML кода
  • - Работа с CSS классами
  • - Динамическая смена классов и стилей
  • - Управление отображением элементов
  • - Toggle у классов
  • - Работа со списками
  • - Сбросы с форм и валидация
  • - Отображение пользовательских ошибок
  • - Фильтрация элементов массива
  • - Оптимизация приложения с computed
  • - Передача параметров от родителя к компоненту и обратно
  • - Передача методов от ребенка на родитель
  • - Оптимизация компонентов
  • - Обработка ошибок
  • - ----- Вторая часть -----
  • - Подключение vue-cli
  • - Применение своего шаблона
  • - Разбивание логики по компонентам
  • - Подключение VUEX
  • - Хранение и сбор данных - геттеры и стейт
  • - Асинхронные действия в Actions
  • - Работа с mutations и изменение стейта
  • - Добавление заметок в Хранилище
  • - Вывод значений из Хранилища
#3 Видеоуроки ~1ч. 40м.

Своя сборка на VUE CLI и Vue 3

В текущем модуле мы создадим свою сборку, которую будем переиспользовать во всех последующих проетах!

  • - Преимущества и использование VUE CLI
  • - Установка и знакомство с node.js
  • - Установка VUE CLI через npm
  • - Чем плох флаг -g
  • - Установка глобальных пакетов через npx
  • - Лучшая структура проектов
  • - Подключение SCSS
  • - Подключение шрифтов локально и через CDN
  • - Настройка для не стандартных билдов
  • - Настройка хешей и карт стилей/скриптов
#4 Видеоуроки ~40м.

Vue-router - Динамическая перерисовка

Новый взгляд на роутеринг с Vue.js 3. Научимся строить простые и вложенные маршруты, перерисовывать страницы в зависимости от пути

  • - Основа SPA. Что такое роутер и зачем он нужен
  • - Установка vue-router
  • - Динамическая перерисовка без перезагрузки страницы
  • - Динамичный навбар и ссылки
  • - Активные ссылки
  • - Не существующие роуты - страница 404
  • - Хеш и мод history
#1 Видеоуроки ~1ч.

Vuex + Vue 3

Для быстрого и удобного взаимодействия данные будут храниться внутри приложения. Разберемся как использовать VUEX с Vue.js второй и третьей версии

  • - Правильное хранение данных в VUEX
  • - Использование state
  • - Использование getters
  • - Использование actions
  • - Использование mutations
  • - Разбитие хранилища на модули
#2 Видеоуроки ~30м.

REST API

REST – это архитектурный подход, определяющий, как должны выглядеть API. На REST строится весь современный веб! Далее технлогия REST API будет использоваться во всех последующих приложениях

  • - В чем преимущества REST и почему это лучшее, что есть в вебе
  • - Подробнее про REST API
  • - Один сервер под все версии приложения
  • - Забираем данные с открытых API
  • - Делимся своим API
  • - Защита своего API - CORS / Tokens
  • - CORS дополнительные HTTP-заголовки
  • - Разграничение прав на разные запросы
  • - Все про токены и безопасность авторизаций
  • - Разница между REST API и graphql
  • - Применение graphql как типизация данных и прослойка между REST
#3 Видеоуроки ~50м.

Приложение Clash of Clans

В этом приложении, как и во всех последующих, мы будем использовать vue-roter и vuex. Все персонажи будут храниться в общем хранилище. А роутер будет обрабатывать все динамические маршруты.

  • - Настройка vuex и vue-router
  • - Создание динамического меню
  • - Активная ссылка по текущему роуту
  • - Создание компонента карточек
  • - Хранение картинок
  • - Использование Слотов для карт
  • - Переиспользование компонентов
  • - Хранение и динамическое взаимодействие с картинками в приложении
  • - Знакомство с сидерами (seeders)
  • - Оптимизация компонентов - хранение всех данных в json массиве
  • - Перенос данных во vuex
  • - Хранение и сбор данных - геттеры и стейт
  • - Асинхронные действия в Actions
  • - Работа с сторонними плагинами на примере слайдера
  • - Подключение слайдера со списком персонажей
  • - Адаптация приложения под мобильные устройства
  • - Подгрузка единичного персонажа через отдельный компонент
#4 Записанный вебинар ~1ч. 10м.

Composition API

Знакомство с новым Composition API на примере написания модальных окон, форм и обработчиков

  • - Знакомство с setup()
  • - Реактивные ссылки
  • - Методы и комьютеды в Composition API
  • - Динамические атрибуты
  • - Модель для работы с формами
  • - Текстовый инпут / Текстарея
  • - Чекбоксы / Радио кнопки / Селекты
  • - UI компонент модального окна
  • - Использование слотов на практике
  • - Закрытие модального окна по клику на крестик, область или ESC
  • - Валидация входящих параметров
  • - Связь дочерних компонентов
  • - "Шаринг" стейта приложения
#5
Новый модуль
Видеоуроки ~2ч. 10м.

Приложение Twitter - Composition API

Начнем писать клон твиттера с использованием Composition API

  • - -- Основное: --
  • - Всё приложение на Composition API 🔥
  • - Динамические сортировки масива с любыми данными 🔥
  • - Универсальные модальные окна и порталы
  • - Прелодер, подвешаный на кнопки и страницы
  • - Понимание конекста и новый способ работы с emits
  • - Формы, имитация подгзагрузки содержимого и многое другое!
  • - -- Дополниельно: --
  • - Настройка markdown разметки
  • - Использование md для создание твита
  • - Seeders для хранения данных
  • - Рендеринг твитов
  • - Написание своего плагина для сортировки всех сообщений
  • - Сортировка данных по дате создания и имени
  • - Универсальный метод сортировки любых данных
  • - Обработка ошибок
  • - Перенос данных в vuex
  • - Жизненные циклы компонентов
  • - Хранение и сбор данных - геттеры и стейт
  • - Асинхронные действия в Actions
  • - Смена стейта через мутации
#6
Новый модуль
Видеоуроки ~1ч. 10м.

Приложение Twitter - Firebase по REST API

Научимся отправлять запросы с фронтенда на Firebase, используя asiox или fetch и Composition API

  • - -- Основное: --
  • - Работа по REST API с Firebase
  • - Запрос, ответ, дожидание ответа
  • - GET запросы
  • - POST / PUT запросы
  • - Полная настройка markdown разметки
  • - Работа с axios и настройка своего конфига
  • - -- Дополниельно: --
  • - Методы взаимодействия с сервером
  • - Различия между axios и fetch
  • - Установка axios базовое использование
  • - Firebase - регистрация нового проекта
  • - Запрос PUT - редактирование постов / комментариев
  • - Установка axios
  • - Получение ключа для работы по API
  • - Подключение по API к firebase
  • - Добавление новых постов через POST запрос
  • - Отправка POST и GET запросов
  • - Подгрузка данных со стороннего API
  • - then и обработка ответов
  • - catch и обработка ошибок
#7 Видеоуроки ~1ч. 20м.

Star Wars Wiki

TypeScript + Composition API, работа с открытым API звездных войн. Это будет модуль, в котором мы раскроем весь потенциал вью 3 в связке TS + Composition API!

  • - Зачем нужна типизация
  • - Основы TypeScript
  • - Компиляция и базовая настройка
  • - Типы данных
  • - Типы функций
  • - Интерфейсы
  • - Пространства имен
  • - Подключение TS во vue
  • - Описание типов используя vue 3
  • - Написание api на ts
  • - Интеграция ts файлов в вью компоненты
  • - Знакомство с REST API
  • - Отправка гет запросов
  • - Знакомство с axios и FETCH
  • - Получение ответов от сервера
  • - Рендер данных полученных от сервера
#8 Видеоуроки ~40м.

Бонус #1 - Git и GitHub

Поскольку в курсе будет несколько выпускных проектов, то я посчитал нужным добавить видео по работе с GIT, для того чтобы вы могли организовать свое портфолио на GitHub и GitHub Pages, что увеличит шансы найти работу или получить больше заказчиков!

  • - GIT Введение
  • - Создание первого коммита
  • - Создание репозитория на GitHub
  • - Загрузка проекта в Ваш репозиторий на GitHub
  • - Добавление новых коммитов
  • - Настройка GitHub Pages для демонстрации работы приложения
  • - Загрузка Вашего Демо на GitHub Pages
  • - Примечание: Бонус вставлен порционно во все модули (это позволило на практике показать, как работать с Git на примере Github)
#9
Новый модуль
Доп. материалы

Бонус #2 - Книжки и статьи

Дополнительный материал по вью 3: Большой набор видео, огромное кол-во статей и пять книжек

  • - Порядка семи книжек только по вью 3 🔥
  • - 40+ статей только по вью 3 и options / composition api 🔥
  • - 20+ видео с ютуба
#10
Новый модуль
Доп. материалы

Бонус #3 - Сборка проектов и компонентов

Набор проектов на вью 3 на все случаи жизни, компоненты и различные библиотеки.

  • - 14+ проектов написаных на вью 3 (все с исходниками) 🔥
  • - Шесть дополнительных проектов (вью 3), в основном под сторонние АПИ и firebase (все с исходниками) 🔥
  • - Три админ панелей на вью 3 (все с исходниками)
  • - Тостеры и другие библиотеки под вью 3 (часть с поддержкой вью 2)
  • - Фреймворки под вью 3 и вью 2
Информация о курсе:
  • Последнее обновление: 17-11-2021
  • Количество домашних работ: 5
  • Количество отзывов: 13
  • Количество достижений: 12
Информация о видеоуроках:
  • Продолжительность: ~18 ч.
  • Количество модулей: 21
  • Количество видеоуроков: 112
  • В видеоуроки включено: 115 статей
Записаться на курс
Я решил отменить вебинары на текущем курсе при этом уже проведенные вебинары доступны в записи, вы можете посмотреть их в любое время из личного кабинета. Такой подход позволил оставить цену на доступном уровне и не привязываться к временным рамкам!
Более того, записавшись на курс сейчас, вы получите доступ к будущим вебинарам, когда возобновятся потоки, это будет бесплатно и без доплат.
Евгений, автор курса.

11 проектов в портфолио

4 Выпускных проекта, плюс бонус - 7 проектов из курса «Vue.js с нуля до про»

Весь курс будет основан на практике, потому что именно благодаря практике идет реальное обучение. Ниже показаны примеры выпускных приложений, которые будут разработаны на курсе!

  • Twitter
    Twitter
    • 🔥 Composition API + Vue 3
    • Markdown разметка
    • Использование Firebase по REST API
    Посмотреть Демо
  • Star Wars Wiki
    Star Wars Wiki
    • 🔥 Composition API + Vue 3
    • 🔥 TypeScript
    • Работа с API по техлогии REST
    • Отправка запросов на апи через отдельные сервисы
    • Хранение данных полученных от сервера
    • Постраничная пагинация элементов
    Посмотреть Демо
  • Clash Of Clans
    Clash Of Clans
    • Vue-Router в связке Vue.js 3
    • Динамических маршрутов
    • Храниение и взаимодействие с данными из Seeders
    • Слайдер с персонажами
    Посмотреть Демо
  • Notes App
    Notes App
    • Полная настройка VUE CLI 3 на Vue 3
    • VUEX + Vue 3
    • Создание глобальных конфигов
    • Передача данных между компонентами
    • Разделение логики по компоненты
    • Локальное хранилище
    • Фильтрация элементов
    Посмотреть Демо
  • Notify App
    Notify App
    • Создание своего API
    • Работа с CORS - делимся своим API
    • LoadMore - постепенная подгрузка содержимого
    • Ленивая подгрузка содержимого
    • Хранение данных полученных от API в Vuex
    • Бонус из курса «Vue.js с нуля до про»
    Посмотреть Демо
  • Users CRM
    Users CRM
    • Работа со сторонним API
    • Сбор данных через REST API
    • Сортировка входных данных
    • Пагинация входных данных
    • Бонус из курса «Vue.js с нуля до про»
    Посмотреть Демо
  • GitHub Finder
    GitHub Finder
    • Работа с API GitHub
    • Вывод информации о пользователе
    • Вывод репозиториев пользователя
    • Обработка ошибок
    • Бонус из курса «Vue.js с нуля до про»
    Посмотреть Демо
  • Shop App
    Shop App
    • Работа с Vue-Router
    • Создание динамических маршрутов
    • Храниение и взаимодействие с данными из Vuex
    • Работа с общим стейтом приложения
    • Бонус из курса «Vue.js с нуля до про»
    Посмотреть Демо
  • Modals
    Modals
    • Переиспользование компонентов
    • Валидация полей
    • Скрытие элементов при клике за облость
    • Отслеживание клавиш
    • Отправка данных с форм на почту + в телеграмм канал
    • Бонус из курса «Vue.js с нуля до про»
    Посмотреть Демо
  • Notes App Vue.js 2
    Notes App Vue.js 2
    • Полная настройка VUE CLI 3
    • Работа с emit
    • Компонентный подход
    • Разделение логики на компоненты
    • Фильтрация элементов
    • Удаление и редактирование элементов
    • Бонус из курса «Vue.js с нуля до про»
    Посмотреть Демо
Второй курс в подарок

Записавшись на курс по «Vue.js 3 с нуля до результата», вы получаете второй курс по «Vue.js 2» бесплатно и навсегда!

Суммарно вы получаете более 300 видеоуроков, доступ к трем записанными вебинарам, десять домашних зданий, два сертификата, 11 проектов в портфолио и доступ к общей группе с вакансиями по трудоустройству!

Курс по Vue.js 3
Записаться на курс
Почему Tocode?

Ответы на часто задаваемые вопросы:

  • Необходимый уровень для прохождения курса?
    Курс идет по ступеням - от легкого к более продвинутому.
    Поэтому на начальном этапе будет достаточно пониманимать базис JavaScript, а со всем остальным мы разберемся постепенно!

    Хорошей практикой будет, если вы уже верстали сайт с применением нативного js или jquery, тогда вы легко освоите vue.js! Обычно, верстальщикам этот фреймворк дается проще всего!
  • Курс уже записан или это формат вебинара?
    Курс уже записан и полностью доступен. Был выбран формат записи коротких и структурированных видео, разбитых по модулям с плавной и понятной подачей материала. Без воды, только практика. Такой подход позволяет оставить цену на доступном уровне и значитльно повысить качество материала!

    Также, помимо видеоуроков, вам будут доступны два уже записанных вебинара с методичками и описанием для лучшего усвоения материала.
  • После курса меня возьмут на позицию Frontend разработчика?
    Этот курс нацелен на успешное трудоустройство. В составлении этого курса мне помогал мой бывший коллега, который сейчас является рекрутером на позицию Frontend-Разработчик / Vue-разработчик. Поэтому у вас есть все шансы успешно устроиться на работу Frontend разработчиком. Более того, как показал опрос по вью 2, 89% студентов уже нашли работу, большенство из которых сделали это уже в первые недели обучения.
    Опрос студентов vue.js
  • Как будет осуществляться доступ к курсу?
    Доступ к курсу будет осуществляться из админ панели. Там вы сможете видеть комментарии других пользователей и оставлять свои, скачивать исходники и тд
    Оплачивая, доступ к курсу навсегда сохранятся у вас со всеми последующими обновлениями после завершения учебы.
  • Как происходит отправка домашних заданий?
    Отправка домашних заданий происходит через личный кабинет, там же будет ревью и кол-во полученных баллов.

    В текущем курсе пять домашних заданий, почти каждое домашнее задание доступно в двух вариантах: простое и продвинутое.

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

    Помимо домашних заданий, в текущем курсе есть выпускные проекты. Вместо домашних заданий вы можете сделать выпускной проект и получить сертификат.

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

    Домашние здания можно прислать на проверку и получить ревью в течении 5 (пяти) месяцев с момента записи на курс. После пяти месяцев вы также можете прислать домашнее задание, но только одним архивом, и получить ревью сразу по всем дз, которые будут присланы.
  • Если я что-то не пойму?
    В курсе обсуждаются продвинутые темы при этом - достаточно простым языком и по ступеням - от легкого к тяжелому. Поэтому не понять очень сложно. Есть группа в телеграмме, в которой могут помочь участники курса, в том числе и я. Если вопрос более глобальный - мы всегда можем списаться и закрыть пробелы в знаниях.