← На главнуюМодуль

HTML / CSS

Верстаешь интерфейсы.

Фундамент вёрстки который нужен любому front-end разработчику.

~1 мес
Самый быстрый старт
При 2-3 часах в день. Самый короткий модуль в программе.
20+
заданий по вёрстке
По каждой теме практика: HTML, Flexbox, Grid, SCSS, адаптив.
1
финальный макет
Верстаешь реальный дизайн из Figma. Работаешь адаптивно и семантично.
Figma
Работаешь с макетом как в команде
Единственный модуль где учишься читать и верстать по дизайну.
SCSS
Современная вёрстка сразу
Кроме CSS изучаешь SCSS, БЭМ и правильную структуру файлов.
17
тем в учебнике
От первого HTML файла до Swiper и насмотренности.

Для кого этот модуль

Одно решение для трёх ситуаций

0️⃣
Полный ноль
Никогда не делал сайты. Начнём с самого начала: первый HTML файл, VS Code, и до финального макета из Figma.
🕳
Есть пробелы
Что-то смотрел, но Flexbox путается, Grid не идёт, адаптив не получается. Закроешь все дыры системно.
💼
Уже знаешь JS, но вёрстка хромает
Бывает. Модуль закрывает этот пробел: Flexbox, Grid и адаптив. Всё, что понадобится в работе.

Программа модуля

Нажми и посмотри, что внутри каждой темы

▶Start
JS
JavaScript40 тем · ~4 мес
↑
Про JavaScriptКак запускать код
ПеременныеТипы данныхОператорыЦиклы и SwitchФункции
ЧислаСтрокиОбъекты: основыОбъекты: углубитьсяМассивыМетоды массивов
Задачи на переменные и типы данныхЗадачи на операторы и условияЗадачи на циклы (for, while, do-while)Задачи на функции и возврат значенийЗадачи на строки и их методыЗадачи на числа и MathЗадачи на объекты: чтение, запись, переборЗадачи на массивы: map, filter, reduce, findЗадачи на вложенные структуры (объекты в массивах)Закрепляют чек-листы 1, 2 и 3 перед продвинутым JS
Деструктуризация + spreadJSONtry...catch...finallyПрототипДата и времяMap и SetЗамыкание. Рекурсия. Каррирование
classООП в JavaScript
Асинхронный кодcallbackPromiseasync/awaitEvent LoopПротокол HTTP + fetch
Решаем CodewarsРазбор частых вопросов на собесах
Тех. собес по JavaScript
✓Чек-лист HTML/CSS сдан

Финальный проект

Верстаешь реальный лендинг по Figma-макету. От нуля до адаптивной страницы

Финальный проект
NeoFi: Web3 Landing
Полноценный лендинг для блокчейн-продукта. Тёмная тема, зелёный акцент, 3D-элементы и мобильный адаптив. Верстаешь по реальному Figma-макету как в команде.
Что внутри
Hero с CTAЛоготипы партнёровФичи (3 карточки)СтатистикаПреимуществаCTA-секцияФутер
Что применяешь
HTML5CSS3FlexboxGridSCSSАдаптивная вёрсткаSwiperFigmaБЭМ
Листай чтобы увидеть всё ↓Desktop + Mobile
NeoFi, финальный проект HTML/CSS

Что сможешь после

Конкретные навыки, а не абстрактное "знание HTML"

✓Верстать страницы по макету из Figma
✓Делать адаптивную вёрстку (mobile-first)
✓Уверенно работать с Flexbox и Grid
✓Писать семантический HTML
✓Использовать SCSS в реальном проекте
✓Анимировать элементы через CSS transitions
✓Понимать БЭМ и структуру кода
✓Подключать Swiper, шрифты, иконки

Куда дальше после модуля

JavaScript + HTML/CSS уже есть. Дальше React

Частые вопросы

Нужен ли опыт в программировании до начала?
Нет. HTML/CSS не требует навыков программирования. Начинаем с нуля: создаём файл, запускаем страницу и разбираемся, как работает браузер. Достаточно базового умения пользоваться компьютером.
Сколько времени займёт модуль?
При 2-3 часах в день ориентир составляет около месяца. Это самый короткий модуль в программе: 19 тем и финальный проект. Двигаешься в своём темпе.
Нужен ли HTML/CSS если я уже знаю React?
Да, если знаешь поверхностно. Многие React-разработчики путаются в position, выборе Grid или Flexbox и семантике. На собеседованиях это быстро становится заметно.
Достаточно ли HTML/CSS для работы?
Нет. HTML/CSS стоит вторым модулем в программе. Останавливаться здесь нет смысла. Следующий шаг: React, Redux Toolkit и TypeScript.
Что такое финальный проект?
Верстаешь полноценную страницу по реальному Figma-макету. Работаешь с адаптивом, семантикой и чистым кодом. Ментор Натали проверяет результат и даёт конкретную обратную связь.

Стоимость

Куда дальше:
После модуля → JavaScript
990 BYN
1 платёж