Курс на Stepik
Обложка курса «Мастер-класс по верстке сайта с нуля • Astro.js, SCSS, JS, БЭМ» на Stepik
1 999 ₽

Мастер-класс по верстке сайта с нуля • Astro.js, SCSS, JS, БЭМ ★ 5.000

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

Практический курс по верстке многостраничного сайта «ИгроПолис» с нуля. Вы пройдёте весь процесс разработки на Astro.js: от структуры проекта до финальной верстки. В работе используются БЭМ, SCSS и JavaScript. Курс ориентирован на практику и реальный результат.

Показатель Текущие показатели Рост
Значение 🏆 Рейтинг 3 дн 7 дн 30 дн
Количество учеников на курсе «Мастер-класс по верстке сайта с нуля • Astro.js, SCSS, JS, БЭМ»Учеников на курсе 15
Сертификаты, выданные на курсе «Мастер-класс по верстке сайта с нуля • Astro.js, SCSS, JS, БЭМ»Сертификатов выдано 0
Отзывы о курсе «Мастер-класс по верстке сайта с нуля • Astro.js, SCSS, JS, БЭМ»Отзывов получено 2
Рейтинг курса «Мастер-класс по верстке сайта с нуля • Astro.js, SCSS, JS, БЭМ»Рейтинг курса 5.000
Уроки в курсе «Мастер-класс по верстке сайта с нуля • Astro.js, SCSS, JS, БЭМ»Количество уроков 45
Время прохождения курса «Мастер-класс по верстке сайта с нуля • Astro.js, SCSS, JS, БЭМ»Время прохождения курса —
Стоимость курса «Мастер-класс по верстке сайта с нуля • Astro.js, SCSS, JS, БЭМ»Стоимость курса 1 999 ₽ —
Обновления курса «Мастер-класс по верстке сайта с нуля • Astro.js, SCSS, JS, БЭМ»Обновления курса — —
Дата публикации курса «Мастер-класс по верстке сайта с нуля • Astro.js, SCSS, JS, БЭМ»Дата публикации курса — ———
Последнее обновление курса «Мастер-класс по верстке сайта с нуля • Astro.js, SCSS, JS, БЭМ»Последнее обновление — ———
Сложность normal — ———

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

Разделы в курсе «Мастер-класс по верстке сайта с нуля • Astro.js, SCSS, JS, БЭМ» 6 разделов Уроки в курсе «Мастер-класс по верстке сайта с нуля • Astro.js, SCSS, JS, БЭМ» 45 уроков Время прохождения курса «Мастер-класс по верстке сайта с нуля • Astro.js, SCSS, JS, БЭМ» 21 ч. Последнее обновление курса «Мастер-класс по верстке сайта с нуля • Astro.js, SCSS, JS, БЭМ» обн. 25 марта 2026

Введение, подготовка проекта и анализ

3 урока
1. Введение. Чему научитесь, и что нужно знать ↗
2. Обзор шаблона на Astro.js ↗
3. Подключение шрифтов и базовые переменные ↗

Разработка шапки и футера сайта

11 уроков
1. Базовый шаблон шапки ↗
2. Навигация ↗
3. Поиск. Часть 1 ↗
4. Поиск. Часть 2 ↗
5. Результаты поиска. Часть 1 ↗
6. Результаты поиска. Часть 2 ↗
7. Выбор темы сайта. Часть 1 ↗
8. Выбор темы сайта. Часть 2 ↗
9. Модальное окно входа ↗
10. Футер и соцсети ↗
11. Компонент кнопки ↗

Главная страница и каталог

12 уроков
1. Слайдер на главной странице ↗
2. Подборки на главной странице ↗
3. Отзывы на главной странице ↗
4. Статьи на главной странице ↗
5. Cookie-предупреждение и кнопка "наверх" ↗
6. Hero-блок каталога и хлебные крошки ↗
7. Переключение сетки каталога ↗
8. Фильтры. Кастомный чекбокс ↗
9. Range-слайдер рейтинга ↗
10. Скрипты обработки фильтров ↗
11. Кастомный селект ↗
12. Карточка игры и тултип ↗

Страница игры

9 уроков
1. Hero-блок страницы игры. Видео на фоне ↗
2. Компонент информации об игре. Рейтинг ↗
3. Меню страницы игры. Табы ↗
4. Таб "Об игре". Блок характеристик ↗
5. Таб "Об игре". Карточка отзыва ↗
6. Табы "Отзывы", "Статьи", "Подборки" ↗
7. Остальные табы на странице ↗
8. Модальные окна "Статус" и "Отправить отзыв" ↗
9. Страницы "Подборки", "Статьи" и "Прохождения" ↗

Остальные страницы

6 уроков
1. Личный кабинет. Hero. Левое меню ↗
2. Табы кабинета. Карточка комментария ↗
3. Табы кабинета. Карточка подписчика. Настройки личного кабинета ↗
4. Страница статьи ↗
5. Страница отзыва ↗
6. Toast-уведомления и страница 404 ↗

Адаптивная верстка

4 урока
1. Адаптив главной страницы ↗
2. Адаптив каталога и страницы игры ↗
3. Адаптив личного кабинета ↗
4. Адаптив последних страниц ↗