Онлайн-курс
Vite 8 — самый быстрый сборщик для фронтенда. Сборка стала в 10–30 раз быстрее. Проект стартует за секунду, изменения в коде видны мгновенно.
На курсе соберём полноценный проект с нуля: стили, графика, тесты, деплой и CI/CD. А ещё получим готовый рецепт миграции с Webpack или Gulp.
Большинство проходит курс за 2–4 недели. Начинайте прямо сейчас и двигайтесь в своём темпе.
Сборщик превращает код, стили и картинки в оптимизированный сайт: минимальный JavaScript, сжатые изображения, один файл CSS. Без него всё это приходится делать вручную.
Vite скачивают 40–65 миллионов раз в неделю через npm. React, Vue, Svelte, Nuxt перешли на Vite по умолчанию. Вакансии требуют этот навык. Восьмая версия стала в разы быстрее: и на старте dev-сервера, и при финальной сборке.
После курса сможем создавать сборки и менять конфиги в рабочих проектах. Vite сам оптимизирует код, картинки и стили, а при разработке обновляет страницу за миллисекунды.
Курс подходит тем, кто раньше не работал со сборщиками, и тем, кто переезжает с Webpack или Gulp. В шестом разделе разберём миграцию с обоих.
Каждый модуль: теория, практическое задание и эталонное решение. Решаем задачу, сверяем результат с эталоном.
Вы фронтенд-разработчик и хотите настроить сборку, которая работает предсказуемо — от первой команды до CI/CD.
Хотите освоить Vite для карьерного роста — сборщик требуют в вакансиях, и его стоит знать системно.
Цените структурированное обучение — теория, демо, практика, эталонное решение в каждом модуле.
Устали собирать знания по Vite из документации и англоязычных видеороликов.
Нужен настроенный проект с тестами, деплоем и CI/CD — и готовый рецепт миграции с Webpack или Gulp.
Сделано для разработчиков, у которых мало времени на обучение.
На курсе вы получите:
Связывает теорию с типовыми задачами на рынке. У вас будет понимание того, где и как применить полученную теорию.
Построена от простого к сложному. Вы легко погрузитесь в тему, даже если ничего про неё не знали раньше.
Актуальная и обновляемая теория, проверенная рынком. Никакой «воды» — вы получите только необходимые знания.
Поможет вам с ответами на вопросы и углублением знаний.
Комьюнити каждого курса — это авторы, опытные разработчики и студенты, прошедшие или проходящие этот курс.
Комьюнити не только помогает в освоении материала, но и постоянно делает курс лучше.
Курс предполагает самостоятельное изучение материала в комфортном режиме. Приступить к обучению можно прямо сейчас.
Материал разбит на модули, каждый из которых позволит постепенно осваивать навык от основ до тонкостей.
В каждом модуле может быть:
Полезные статьи о принципах работы с Vite.
Структурированная информация, необходимая для усвоения навыка.
Пошаговые примеры решения типовых задач.
Показывают, как правильно писать код, и учат применять теорию на практике.
Для закрепления полученной теории.
Учат решать задачи, которые встречаются в реальной работе.
Готовые решения заданий. Подскажут, как решить задачу, если что-то не получается.
Вопросы по статьям раздела. Помогают проверить, всё ли запомнилось.
Если что-то не получилось, можно посмотреть ответы и пояснения к ним, а затем пройти тест заново.
Cообщество авторов, опытных специалистов и студентов курса.
Общайтесь с единомышленниками и обменивайтесь опытом.
Программа построена так, чтобы постепенно углублять знания.
Для кого: начинающие и профессиональные-разработчики — те, кто начинает работать со сборщиками или переезжает на Vite с другого инструмента. Единственный курс по Vite на русском с практикой и эталонными решениями.
Необходимые знания: базовый JavaScript, Git.
Разберём, что такое Vite и за счёт чего он работает быстрее других сборщиков. Освоим Vite CLI и развернём первый проект.
Настроим конфигурационный файл, организуем файловую структуру проекта. Подключим стили через Lightning CSS и препроцессоры, настроим работу с графикой и соберём многостраничный сайт.
Разберём режимы сборки и переменные окружения. Задеплоим проект на GitHub Pages и настроим автоматический деплой через GitHub Actions.
Подключим Vitest и напишем тесты: матчеры, снимки, фиктивные функции, таймеры. Настроим покрытие кода.
Подключим плагины для линтинга, атомарного CSS и сжатия. Настроим алиасы и разберём интеграцию Vite с Vue, React и Svelte, SSR и мета-фреймворки.
Сравним Vite с Gulp и Webpack, пройдём пошаговую миграцию обоих инструментов. Подведём итоги курса.
«Мы полгода откладывали миграцию с Webpack — проект большой, страшно было что-нибудь сломать. Модуль по миграции в курсе дал готовый пошаговый рецепт, и я перевёл наш рабочий проект за один день. Сборка, которая занимала 40 секунд, сейчас укладывается в три».
Андрей Волков, фулстек-разработчик
«У меня было мало времени — работа до семи, потом домашние дела, и я сомневалась, что вообще дотяну до конца. Модули оказались компактными: один вечер — одна тема, теория плюс практика, без ощущения, что тонешь в материале. Прошла все шесть модулей за три недели, а эталонные решения после каждого задания помогли разобраться там, где сама бы застряла».
Марина Козлова, фронтенд-разработчик
«Курс отлично подойдёт для тех, кто хочет погрузиться в работу с Vite. Затрагиваются разные темы понемногу, материал изложен очень доступно — этой базы достаточно, чтобы остальное разобрать самостоятельно. Отдельное спасибо авторам за знакомство с инструментами для Node.js и Vite, а также за раздел, посвящённый Vitest».
Николай Думчев, Frontend TeamLead в Planeta.ru
«До курса пару месяцев ковырял документацию Vite, смотрел видео, спрашивал нейросети — в голове осела каша из отдельных рецептов без понимания, почему они работают. Курс выстроил всё в систему: после каждого модуля я понимал, что происходит под капотом, и мог объяснить это словами. Сейчас спокойно разбираюсь с незнакомыми плагинами и настройками сам — читаю исходники и документацию осмысленно».
Кирилл Захаров, фронтенд-разработчик
«Cамостоятельно всё это изучать можно, но довольно проблематично, потому что информации в интернете много. Она какая-то разрозненная, в некоторых местах противоречивая. А здесь, что мне понравилось, выжимки очень конкретные с объяснениями дают. Направляют куда нужно, дают вектор развития».
«У меня есть мнение, что HTML Academy делает курсы прикладные для специалистов. Что студент выйдет сразу с общим представлением о вопросе, уже имея набор практических решений».
«Когда находишь правильное решение, и оно работает, ошибок не выдаёт, ты все равно сомневаешься, а правильно ли ты сделал. На курсе коллективная работа, авторитетное мнение. Это как компас, ориентир».
«Курс даёт широкий обзор темы — хорошая отправная точка для дальнейшего погружения».
Дмитрий Осадченко · Vite 5
После прохождения курса вы получите электронный сертификат
Образовательная деятельность осуществляется на основании государственной лицензии № 3026 от 6 июня 2017 года.
14 лет выстраиваем связь с рынком коммерческой разработки. Учим начинающих разработчиков и видим, как они становятся опытными специалистами.
Перед запуском курса убеждаемся, что он даёт востребованный профессиональный навык.
Мы общаемся с сообществом веб-разработчиков и понимаем, как нужно учить. Максимально сокращаем время от изучения теории до решения типовых задач.
Загружаем…