🎓 Бесплатный курс для начинающих

Освойте веб-разработку
с нуля за 9 уроков

Интерактивные уроки по HTML, CSS и JavaScript с живыми примерами, практикой и отслеживанием прогресса. Без регистрации и скучной теории.

9уроков
3раздела
12+часов практики
300студентов сейчас

Программа курса

Идём по порядку: сначала структура страницы, потом стили, а затем — интерактив.

HTML · Урок 1

Введение в HTML

Что такое HTML, как устроена веб-страница и самый первый разметочный каркас документа.

Читать урок →
✔ Пройдено
HTML · Урок 2

Теги и атрибуты

Заголовки, абзацы, списки и атрибуты — кирпичики, из которых строится контент.

Читать урок →
✔ Пройдено
HTML · Урок 3

Ссылки, изображения и таблицы

Навигация между страницами, вставка картинок и табличное представление данных.

Читать урок →
✔ Пройдено
CSS · Урок 4

Введение в CSS

Зачем нужны стили, способы подключения и первые правила оформления текста.

Читать урок →
✔ Пройдено
CSS · Урок 5

Селекторы, блочная модель и позиционирование

Как CSS выбирает элементы, что такое коробочная модель и как двигать блоки.

Читать урок →
✔ Пройдено
CSS · Урок 6

Flexbox и CSS Grid

Два мощных инструмента для построения адаптивных макетов любой сложности.

Читать урок →
✔ Пройдено
JS · Урок 7

Введение в JavaScript

Переменные, типы данных, операции и первая программа на самом живом языке веба.

Читать урок →
✔ Пройдено
JS · Урок 8

Функции, условия и циклы

Логика программ: ветвления, повторяющиеся действия и вездесущие функции.

Читать урок →
✔ Пройдено
JS · Урок 9

DOM и события

Связываем JavaScript с HTML: откликаемся на клики, меняем страницу на лету.

Читать урок →
✔ Пройдено
Общий прогресс курса 0 из 9 (0%)

Почему этот курс

Всё, что нужно, чтобы сделать первый сайт самому.

🖥️

Практика с первого урока

Каждый урок содержит живые примеры и задания, которые сразу можно открыть и трогать.

📈

Прогресс сохраняется

Отмечайте пройденные уроки — браузер запомнит ваш прогресс (данные хранятся локально).

🧱

От основ к проекту

HTML → CSS → JavaScript. После курса вы сможете собрать полноценный лендинг.

🚀

Современные технологии

Flexbox, Grid, семантическая разметка и чистый современный JavaScript — без устаревших приёмов.