Автор: HTML academy
Название: Разметка по БЭМ (2021)
Описание:
Профессиональная задача:
Анализируя графический макет, нужно разделить интерфейс на компоненты и спроектировать их структуру по методологии БЭМ.
Зачем нужен этот навык:
Методология БЭМ (Блок, Элемент, Модификатор) — широко распространённый в веб-разработке компонентный подход к описанию структуры интерфейса. Такая структура позволяет быстро создавать предсказуемую и надёжную вёрстку интерфейсов любой сложности. БЭМ-компоненты можно легко расширять и переиспользовать без дублирования кода. Освоив этот навык, вы сможете на этапе анализа макета уверенно разделять интерфейс на независимые блоки и их элементы, определять взаимосвязи между ними, а затем воплощать полученную структуру в разметке.
Состав навыка
Подготовительный материал
Дополняет базовые знания, полученные в интерактивных курсах, всем необходимым для начала отработки кейсов.
Углублённая теория
Углублённая теория и методики общим объёмом 30-50 страниц.
Демонстрационные кейсы
Три демонстрационных кейса: 1 лёгкого уровня, 1 среднего уровня и 1 сложного уровня.
В каждом кейсе в качестве входных данных мы получаем дизайн страниц. Затем, используя предложенную методику, пошагово создаём разметку. На выходе получаем готовую разметку. Все шаги детально описаны.
Пошаговые разборы кейсов
Один разбор для каждого демо-кейса.
Разборы кейсов выполнены в виде подробных текстовых демонстраций с поясняющими иллюстрациями и примерами кода.
Тренировочный материал
Для тренировочных кейсов нет подробных разборов, но есть эталонное решение от авторов, которое можно сравнить со своим.
Название: Разметка по БЭМ (2021)
Описание:
Профессиональная задача:
Анализируя графический макет, нужно разделить интерфейс на компоненты и спроектировать их структуру по методологии БЭМ.
Зачем нужен этот навык:
Методология БЭМ (Блок, Элемент, Модификатор) — широко распространённый в веб-разработке компонентный подход к описанию структуры интерфейса. Такая структура позволяет быстро создавать предсказуемую и надёжную вёрстку интерфейсов любой сложности. БЭМ-компоненты можно легко расширять и переиспользовать без дублирования кода. Освоив этот навык, вы сможете на этапе анализа макета уверенно разделять интерфейс на независимые блоки и их элементы, определять взаимосвязи между ними, а затем воплощать полученную структуру в разметке.
Состав навыка
Подготовительный материал
Дополняет базовые знания, полученные в интерактивных курсах, всем необходимым для начала отработки кейсов.
Углублённая теория
Углублённая теория и методики общим объёмом 30-50 страниц.
Демонстрационные кейсы
Три демонстрационных кейса: 1 лёгкого уровня, 1 среднего уровня и 1 сложного уровня.
В каждом кейсе в качестве входных данных мы получаем дизайн страниц. Затем, используя предложенную методику, пошагово создаём разметку. На выходе получаем готовую разметку. Все шаги детально описаны.
Пошаговые разборы кейсов
Один разбор для каждого демо-кейса.
Разборы кейсов выполнены в виде подробных текстовых демонстраций с поясняющими иллюстрациями и примерами кода.
Тренировочный материал
- Методика
- 3 кейса лёгкого уровня
- 3 кейса среднего уровня
- 3 кейса сложного уровня
- Дополнительная теория
Для тренировочных кейсов нет подробных разборов, но есть эталонное решение от авторов, которое можно сравнить со своим.
Cкрытый контент, нужно авторизируйся или присоединяйся.
Возможно, Вас ещё заинтересует:
- [Филипп Игнатенко] [merion academy] DevOps-инженер с нуля (2025)
- [Яндекс.Практикум] Python‑разработчик буткемп (2025)
- [Алексей Черемных] Администрирование ViPNet-сетей
- [deworker.pro] Стрим про безопасность web-приложений
- [Дмитрий Чернов] AL-1724VR Установка и управление виртуализацией в ОС Astra Linux Special Edition 1.7
- [HTB Academy] Сертифицированный специалист по тестированию на проникновение Hack The Box (часть 2)
- [Step Up] Разработчик чат-ботов. Уровень Мастер
- [PurpleSchool] Golang - Templ Fiber HTMX (2025)
- [Ильяс Низамутдинов] Программная работа с СКД (2025)
- [Stepik] Запросы в 1С - Углубленное изучение языка запросов
- [Micro courses] Zod - максимально полный курс
- [Stepik] Машинное обучение - Подготовка данных (Модуль 1)
- [Stepik] Web-технологии - практический курс CSS
- [Учебный центр №1] Профессиональная работа в программе 1С Документооборот 8, Редакция 3.0 (2025)
- [Ильяс Низамутдинов] Макеты в СКД. Полное погружение
- [Stepik] Тестирование REST API в Postman - легкий старт в автоматизацию
- [Stepik] Буткемп «Записки юного программиста» git, html, react.js, c# (2024)
- [Stepik] Основы работы в консоли Linux, настройка сетевых служб (кластер)
- [Академия АйТи] Тестирование на проникновение и анализ безопасности. Базовый уровень (2024)
- [Архэ] Искусственный интеллект и машинное обучение - итоги 24 года (2024)