Курс на Stepik
Обложка курса «Frontend разработчик на HTML, CSS и JavaScript» на Stepik
9 900 ₽

Frontend разработчик на HTML, CSS и JavaScript ★ 4.964

Открыть на
STEPIK.ORG

Начните зарабатывать деньги освоив самое важное для веб-разработчика. Изучим HTML, CSS, JavaScript, Figma, Pixso, Photoshop, VS Code, Emmet, BEM, Bootstrap, Vue, React, Git, GitHub, Gulp. Расскажу как составить портфолио, резюме и взять первый заказ на фрилансе.

Показатель Текущие показатели Рост
Значение 🏆 Рейтинг 3 дн 7 дн 30 дн
Количество учеников на курсе «Frontend разработчик на HTML, CSS и JavaScript»Учеников на курсе 1 898
Сертификаты, выданные на курсе «Frontend разработчик на HTML, CSS и JavaScript»Сертификатов выдано 231
Отзывы о курсе «Frontend разработчик на HTML, CSS и JavaScript»Отзывов получено 28
Рейтинг курса «Frontend разработчик на HTML, CSS и JavaScript»Рейтинг курса 4.964
Уроки в курсе «Frontend разработчик на HTML, CSS и JavaScript»Количество уроков 254
Тесты в курсе «Frontend разработчик на HTML, CSS и JavaScript»Количество квизов 699
Задачи с кодом в курсе «Frontend разработчик на HTML, CSS и JavaScript»Количество задач с кодом 110
Время прохождения курса «Frontend разработчик на HTML, CSS и JavaScript»Время прохождения курса —
Стоимость курса «Frontend разработчик на HTML, CSS и JavaScript»Стоимость курса 9 900 ₽ —
Обновления курса «Frontend разработчик на HTML, CSS и JavaScript»Обновления курса — —
Дата публикации курса «Frontend разработчик на HTML, CSS и JavaScript»Дата публикации курса — ———
Последнее обновление курса «Frontend разработчик на HTML, CSS и JavaScript»Последнее обновление — ———
Сложность easy — ———

Содержание курса

Разделы в курсе «Frontend разработчик на HTML, CSS и JavaScript» 15 разделов Уроки в курсе «Frontend разработчик на HTML, CSS и JavaScript» 254 урока Тесты в курсе «Frontend разработчик на HTML, CSS и JavaScript» 699 тестов Задачи в курсе «Frontend разработчик на HTML, CSS и JavaScript» 110 задач Время прохождения курса «Frontend разработчик на HTML, CSS и JavaScript» 89 ч. Последнее обновление курса «Frontend разработчик на HTML, CSS и JavaScript» обн. 2 октября 2026

Основы языка HTML

12 уроков
1. Введение ↗
2. Браузер и редактор ↗
3. Первые HTML теги ↗
4. Путь к файлу ↗
5. Списки и ссылки ↗
6. Таблицы ↗
7. Работа с текстом ↗
8. Формы ↗
9. Атрибуты тегов ↗
10. Цвет RGB и символы ↗
11. Тест по HTML, Часть 1 ↗
12. Итоги модуля ↗

Основы языка CSS

10 уроков
1. CSS селекторы ↗
2. Работа с картинками ↗
3. Границы элементов ↗
4. Размеры элементов ↗
5. Шрифт текста ↗
6. Блочная модель ↗
7. Псевдоклассы и псевдоэлементы ↗
8. Основы CSS Flexbox ↗
9. Тест по CSS, Часть 1 ↗
10. Итоги модуля ↗

Практика по HTML и CSS

9 уроков
1. Создаем меню + ДЗ ↗
2. Верстаем блок + ДЗ ↗
3. Текст и иконки + ДЗ ↗
4. Урок по Photoshop ↗
5. Верстка по макету + ДЗ ↗
6. Финальное задание ↗
7. Тест по HTML, Часть 2 ↗
8. Тест по CSS, Часть 2 ↗
9. Итоги модуля ↗

Работа с Git и GitHub

19 уроков
1. Что такое Git ↗
2. Установка Git ↗
3. Регистрация на GitHub ↗
4. Первые команды Git ↗
5. Работа с Git в VS Code ↗
6. Удаление репозитория ↗
7. Клонирование ↗
8. Расширение Git Graph ↗
9. Алиасы для Git ↗
10. Отмена изменений ↗
11. Работа с ветками ↗
12. Слияние веток Git ↗
13. Синтаксис Markdown ↗
14. Фрагменты кода Gist ↗
15. Хостинг GitHub Pages ↗
16. Портфолио на GitHub ↗
17. Fork и Pull Request ↗
18. Файл .gitignore ↗
19. Итоги модуля ↗

Продвинутый HTML и CSS

10 уроков
1. Редактор кода, Иконки и Emmet ↗
2. Основы CSS Grid ↗
3. Позиционирование, Размеры и Блочная модель ↗
4. Методология БЭМ, Как называть классы в HTML ↗
5. margin или padding, Что лучше использовать ↗
6. Выравнивание по центру и анимация ↗
7. Переменные root и Функция calc ↗
8. Тест по HTML, Часть 3 ↗
9. Тест по CSS, Часть 3 ↗
10. Итоги модуля ↗

Bootstrap

25 уроков
1. Bootstrap 5.0 | 2021 ↗
2. Обзор и подключение ↗
3. Учим основы ↗
4. Сетка 3 на 3 и иконки ↗
5. Сетка 2 на 2 ↗
6. Аккордеон ↗
7. Адаптивная картинка ↗
8. Практика и задание ↗
9. Форма сбора средств ↗
10. Создание футера ↗
11. Обзор документации ↗
12. Библиотека иконок ↗
13. Адаптивный сайт, Создание своей сетки ↗
14. Тест по CSS, Часть 4 ↗
15. Тест по CSS, Часть 5 ↗
16. Bootstrap 5.3 | 2025 ↗
17. Начало работы ↗
18. Макет ↗
19. Контент ↗
20. Формы ↗
21. Компоненты, Часть 1 ↗
22. Компоненты, Часть 2 ↗
23. Помощники и утилиты ↗
24. Дополнительно ↗
25. Итоги модуля ↗

Верстка по макету Figma

19 уроков
1. Работа с Figma и создание проекта ↗
2. Pixel Perfect и верстка Grid + Flexbox ↗
3. Верстаем несколько разделов сайта ↗
4. О работе верстальщика ↗
5. Интерактивные элементы на сайте ↗
6. ДЗ по верстке сайта ↗
7. Фриланс, первый заказ ↗
8. Тест по CSS, Часть 6 ↗
9. Тест по CSS, Часть 7 ↗
10. Структура проекта ↗
11. Обзор макета ↗
12. Работа с Perfect Pixel ↗
13. Адаптивная версия ↗
14. Экспорт SVG ↗
15. Верстаем раздел ↗
16. Тень блока вручную ↗
17. Публикуем код ↗
18. Плагин Inspect Styles ↗
19. Итоги модуля ↗

Верстка в портфолио

17 уроков
1. Сайт 1 - Konstruct ↗
2. Сайт 2 - Alivio ↗
3. Сайт 3 - WD ↗
4. Сайт 4 - Britlex ↗
5. Сайт 5 - Archi Web ↗
6. Сайт 6 - Cloud Budget ↗
7. Сайт 7 - Dae ↗
8. Знакомство с Pixso ↗
9. Работа с SVG ↗
10. Шрифты Google Fonts ↗
11. Perfect Pixel в браузере ↗
12. Раздел сайта Features ↗
13. Раздел сайта Stats ↗
14. Раздел сайта Blog ↗
15. Домашнее задание ↗
16. Макеты для верстки ↗
17. Итоги модуля ↗

Основы JavaScript

17 уроков
1. Работа с JavaScript ↗
2. Строки и логика ↗
3. Шаблонные строки, Случайные числа, Округление чисел ↗
4. Массивы ↗
5. Объекты ↗
6. Диалоговые окна, Тернарный оператор, Переключатель Switch ↗
7. Циклы + практика ↗
8. Функции + практика ↗
9. Дата и время ↗
10. JSDoc и Исключения ↗
11. ООП ↗
12. ECMAScript 2015 (ES6) ↗
13. Задачи на JS, Часть 1 ↗
14. Задачи на JS, Часть 2 ↗
15. Задачи на JS, Часть 3 ↗
16. Задачи на JS, Часть 4 ↗
17. Итоги модуля ↗

DOM на JavaScript

18 уроков
1. Работа с DOM ↗
2. Атрибуты, Элементы ↗
3. Генерация списков ↗
4. Календарь + ДЗ ↗
5. Сортировка таблицы ↗
6. Часы ↗
7. Классы и метрики ↗
8. Таблица из массива ↗
9. Таблица из объекта ↗
10. Таблица из данных ↗
11. Карточки часть 1 ↗
12. Карточки часть 2 ↗
13. Прогресс-бар ↗
14. Генератор имен ↗
15. Работа с localStorage ↗
16. Тест по JS, Часть 1 ↗
17. Задачи на JS, Часть 5 ↗
18. Итоги модуля ↗

События на JavaScript

30 уроков
1. Обработчики событий ↗
2. Скрыть / Показать ↗
3. Простой слайдер ↗
4. Тёмная тема ↗
5. ООП на практике ↗
6. Делегирование и Фазы события ↗
7. Счётчик ↗
8. Переключатель ↗
9. Удаление карточек ↗
10. Разворачиваемые подменю ↗
11. Сортировка таблицы ↗
12. Всплывающая подсказка ↗
13. Отмена стандартного поведения ↗
14. Сочетание клавиш ↗
15. Выделение через CTRL ↗
16. Range-Слайдер ↗
17. События клавиатуры ↗
18. Работа с формами ↗
19. Фокус и потеря фокуса ↗
20. Перемещение по стрелкам ↗
21. События форм и буфера обмена ↗
22. События страницы, async и defer ↗
23. Диапазон и Выделение ↗
24. Проект №1 ↗
25. Проект №2 ↗
26. Проект №3 ↗
27. Тест по JS, Часть 2 ↗
28. Тест по JS, Часть 3 ↗
29. Задачи на JS, Часть 6 ↗
30. Итоги модуля ↗

Библиотеки JavaScript

16 уроков
1. Работа с файлами ↗
2. Анимация на JS и CSS ↗
3. Регулярные выражения ↗
4. list.js: Поиск и сортировка ↗
5. sweetalert2.js: Модальные окна ↗
6. popper.js: Всплывающие подсказки ↗
7. baguetteBox.js: Галерея изображений ↗
8. lightgallery.js: Галерея изображений ↗
9. flatpickr.js: Календарь ↗
10. cleave.js: Формы ↗
11. mixItUp3.js: Фильтрация элементов ↗
12. swiper.js: Слайдер ↗
13. Тест по JS, Часть 4 ↗
14. Тест по JS, Часть 5 ↗
15. Задачи на JS, Часть 7 ↗
16. Итоги модуля ↗

Планировщик Gulp

22 урока
1. Что такое Gulp ↗
2. Установка Node.js ↗
3. Инициализация ↗
4. NPM Пакеты ↗
5. Константа с путями ↗
6. Обработка стилей ↗
7. Отслеживание ↗
8. Обработка скриптов ↗
9. Готовая сборка ↗
10. Autoprefixer, Sourcemaps, Babel ↗
11. Сжатие изображений ↗
12. Минификация HTML ↗
13. Размеры файлов ↗
14. Отслеживание только новых файлов ↗
15. Синхронизация кода с браузером ↗
16. Работа с Pug ↗
17. Работа с Stylus ↗
18. Работа с SASS и SCSS ↗
19. Работа с TypeScript ↗
20. Работа с CoffeeScript ↗
21. Скачать сборку Gulp ↗
22. Итоги модуля ↗

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

23 урока
1. Что такое Vue ↗
2. Структура проекта ↗
3. Интерфейс игры ↗
4. Достижения в игре ↗
5. Экран с вопросами ↗
6. Экран с результатами ↗
7. Начало работы с Vue ↗
8. Обработка событий ↗
9. Циклы и методы ↗
10. Конец игры на Vue ↗
11. Вычисляемые свойства ↗
12. Звук на JavaScript ↗
13. Работа с Git и GitHub ↗
14. Приложение в VK ↗
15. Идеи для практики ↗
16. Изучаем Vue 3 ↗
17. Условия и циклы ↗
18. Интерполяция ↗
19. Стили и классы ↗
20. События и формы ↗
21. Финальный проект ↗
22. Чат-бот + ДЗ ↗
23. Итоги модуля ↗

Основы React

7 уроков
1. Начало работы с React ↗
2. Компоненты, статика ↗
3. Свойства, динамика ↗
4. Состояния, условия ↗
5. Стили и формы ↗
6. Итоги модуля ↗
7. Итоги курса ↗