Интенсив по созданию веб-приложения на Vue и TypeScript — Frontend Blok
И да пребудет с тобой сила!
Курсы
Базовый курс по верстке Продвинутый курс по верстке Курс JavaScript Ручное тестирование Блоги на Wordpress
Марафоны
Flexbox и Grid Марафон SVG для Web Марафон Email Вёрстка Многостраничный сайт Современная верстка Elementor в Wordpress Веб-анимация CSS и JS Анимация на GSAP Создание игр на ThreeJS Создание игры на PhaserJS Vue и TypeScript
Полезноcти
Книги о программировании Шпаргалка Flexbox CSS Шпаргалка Grid CSS Видео с практикой
Вход
Меню
Главная Марафоны Веб-приложение Vue и TypeScript

Веб-приложение
Vue и TypeScript

Изучите основы разработки с Vue и TypeScript, а также создадите полноценное веб-приложение для учета доходов и расходов
Записаться
Дата старта
{{ course.start_date }}
Длительность
3 урока
Стоимость
{{ course.start_price }} РУБ {{ course.old_start_price }} РУБ
Интенсив по созданию веб-приложения на Vue и TypeScript

Что будет на курсе?

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

Расписание

01

урок

Подготовка окружения и базовый каркас (Vite + Vue + TS)
  • Что такое Vite и зачем он лучше Webpack
  • Создание проекта с npm create vite@latest
  • Подключение TypeScript (типы, интерфейсы, где пригодится)
  • Структура проекта: main.ts, компоненты, шаблон
  • Первая связка ref, v-model → вводим «доход»
Результат:Подготовите каркас приложения с вводом дохода и отображением его на экране
02

урок

Расходы и вычисления (основная логика)
  • Создание интерфейса Expense
  • Добавление расходов: title + amount
  • Отображение списка через v-for
  • Удаление расходов (первое взаимодействие с событиями).
  • computed для подсчёта общей суммы расходов
Результат:Вы сделаете калькулятор, который будет выводить список расходов и считать сумму
03

урок

Итоги, баланс и «вау-эффект»
  • computed баланс = доход – расходы
  • Стилизация (немного CSS: карточки, кнопки, цветовая гамма)
  • Сохранение данных в localStorage
  • Опубликуем проект на Github
  • Разбор типичных ошибок учеников
  • Разберем, что еще можно добавить в будущем в приложение
Результат:Полноценное маленькое веб-приложение, которое можно не только опубликовать в портфолио, но и использовать для личных целей

Обучение проходит на авторской платформе

Frontendblok education platform

Как проходит обучение?

Получаете доступ на учебную платформу Frontend Blok
Каждый день в 6 утра по мск открывается доступ к новому уроку
Просматриваете урок длительностью 15-25 минут, где есть теория и практика
Выполняете домашнее задание для закрепления пройденного материала
Отправляете ДЗ куратору и выполняете его рекомендации
Получаете сертификат об окончании обучения: на русском и английском

Зачем учить Vue и TypeScript?

Современные проекты
Эти технологии применяются в веб-приложениях и сервисах любого масштаба. Их активно используют компании и стартапы, а значит, навыки востребованы на рынке.
Удобство разработки
Vue даёт простую и гибкую структуру для интерфейсов, а TypeScript помогает избежать ошибок в коде. Вместе они экономят время и делают проект стабильнее.
Карьерный рост
Владение Vue и TypeScript открывает двери к позициям фронтенд-разработчика. Эти навыки ценят работодатели, и они становятся важной частью портфолио.

Общая информация по курсу

Формат уроков
Уроки заранее записаны и смонтированы так, чтобы не тратить ваше драгоценное время и получать только качественную информацию без воды.
Длительность уроков
В среднем уроки длятся 20-25 минут, в зависимости от темы. Обучение нацелено на практику, мы мало разбираем теорию, но можем разобрать сложные моменты в учебном чате.
Домашние задания
Домашнее задание дается после каждого урока. Выполнение обязательно, потому что оно напрямую влияет на итоговый результат курса.
Время открытия уроков
Уроки открываются каждый день в 06:00 по мск каждый будний день. Они доступны месяц, но на учебной платформе можно приобрести опцию «Вечный Доступ» в любой момент.

Автор курса

Создатель сообщества Типичный Верстальщик
Более 9-ти лет в веб-разработке
Ведёт несколько соцсетей на тему веб-разработки
Основатель сервиса Frontend Help
Запустила учебную платформу Frontend Blok
Anna Blok photo

Учебные проекты

Во время курса вы создадите веб-приложение, используя Vue, TypeScript и Vite.
Учёт доходов и расходов.

Пример выглядит просто, но это база: разберёте Vite, Vue и TypeScript, отработаете реактивность, вычисляемые свойства и события, научитесь хранить данные и соберёте каркас приложения и настроите деплой и Git.

Сколько стоит

Тариф «Самостоятельный»
Доступ к видео и материалам курса на 1 месяц
Доступ к учебному чату
Уроки с теорией без воды и домашки
Бонус: План «Что учить дальше после интенсива»
Сертификат об окончании обучения
{{ course.prices.start.price }} руб
{{ course && course.hasOwnProperty('prices') && course.prices.hasOwnProperty('start') ? course.prices.start.current_price + ' руб' : '' }}
Купить курс

Отзывы с других интенсивов

Евгения Кувшинова
Евгения Кувшинова
12 июня 2025
Отличный марафон, доступное объяснение, всё понятно даже новичку. Спасибо!
Екатерина Титарева
Екатерина Титарева
19 ноября 2024
Благодарю за такой обширный, несмотря на то, что он мини - курс! Как раз хотела получить представление, какие бывают анимации и как с ними работать) Очень понравилось ещё, что есть чат...
Ирина Глыцко
Ирина Глыцко
5 ноября 2024
Курс очень крутой! Многие моменты охотно внедряю в жизнь, чему очень рада)
Дмитрий Смирнов
Дмитрий Смирнов
4 ноября 2024
Прошел марафон по веб-анимации у Анны Блок. Это не совсем курс, это именно марафон. Каждый день вы узнаете новую информацию и делаете домашнюю работу (на выходных отдых, или можно догнать, если отстал)...
Юлия Орешкина
Юлия Орешкина
2 ноября 2024
Курс получился очень насыщенный и интересный! Подача материала на высоте, внимательное отношение к обучающимся и подбор действительно полезной информации, с которой можно успешно развиваться дальше самостоятельно...
Пагинация
Предыдущий
Следующий

Часто задаваемые вопросы

Сколько по времени длятся уроки?
Развернуть
В среднем уроки длятся 20-25 минут, в зависимости от темы. Обучение нацелено на практику, мы мало разбираем теорию, но можем разобрать сложные моменты в учебном чате.
Должен ли я знать что-то заранее?
Развернуть
Будет достаточно базового понимания HTML и JavaScript. На интенсиве мы разберём все шаги подробно, поэтому вы сможете включиться даже с минимальным опытом. Знать TypeScript или Vue заранее не требуется, потому что всему необходимому вы научитесь в процессе.
Нужно ли мне заранее установить какие-нибудь программы?
Развернуть
На курсе мы будем использовать редактор кода Visual Studio Code. Если вы используете другой софт, то вы можете продолжать использовать его, это не повлияет на дальнейшее обучение.
Могу ли я посмотреть уроки в другой день?
Развернуть
Да, уроки вы можете посмотреть в любой день или любое другое удобное время. Главное выполнять практику последовательно к каждому уроку.
Получу ли я сертификат в конце обучения?
Развернуть
Да, мы выдаём сертификаты. Это происходит после того, как вы выполните задания всех уроков.
Закрыть
Юлия Орешкина
Юлия Орешкина
2 ноября 2024
Курс получился очень насыщенный и интересный! Подача материала на высоте, внимательное отношение к обучающимся и подбор действительно полезной информации, с которой можно успешно развиваться дальше самостоятельно. Отдельное спасибо за формирование требований к дипломному проекту. Выполняя его, отрабатываешь реальные навыки, которые требуются веб-разработчику. Спасибо за курс и помощь в обучении Анне, Андрею и всей команде!
Закрыть
Дмитрий Смирнов
Дмитрий Смирнов
4 ноября 2024
Прошел марафон по веб-анимации у Анны Блок. Это не совсем курс, это именно марафон. Каждый день вы узнаете новую информацию и делаете домашнюю работу (на выходных отдых, или можно догнать, если отстал).

Каждый день дается новая информация, новый подход или новая библиотека. Достаточно подробно рассмотрена css-анимация, анимация svg и canvas. Более обзорно разбираются библиотеки Anime.js и GSAP (внимания уделено достаточно, но сами библиотеки требуют вдумчивого самостоятельного копания).

Также обзорно разобраны webGl и ThreeJS. Тем не менее -- за один из уроков создается маленькая игра на webgl и вокруг нее строятся домашнее задание и часть дипломной работы.

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

Учебный чат теплый, хороший ламповый, куратор и Анна отвечают на вопросы, разбирают задания.

Информация в видео доносится в ясно, разборчиво и наглядно.

Спасибо большое.
Закрыть
Екатерина Титарева
Екатерина Титарева
19 ноября 2024
Благодарю за такой обширный, несмотря на то, что он мини - курс! Как раз хотела получить представление, какие бывают анимации и как с ними работать) Очень понравилось ещё, что есть чат с обучающимися, где можно задавать вопросы, видеть результаты других учеников, делиться знаниями и опытом. Было бы здорово добавить побольше заданий, близких к реальным, по примеру дипломной работы - это очень ценно, потом можно использовать в рабочих проектах.