Курс на Stepik
Обложка курса «DOM без хаоса: системная база для React, Vue и Angular» на Stepik
777 ₽

DOM без хаоса: системная база для React, Vue и Angular ★ 0.000

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

Хочешь уверенно работать с React, Vue, Angular — начни с DOM. Этот курс показывает, как браузер превращает HTML в DOM‑дерево, из каких объектов состоит страница и как управлять ими через JavaScript. Ты научишься создавать динамичные интерфейсы, понимать поведение элементов и событий, избавляться от хаоса в коде и закладывать фундамент, без которого современные фреймворки не раскрываются.

Показатель Текущие показатели Рост
Значение 🏆 Рейтинг 3 дн 7 дн 30 дн
Количество учеников на курсе «DOM без хаоса: системная база для React, Vue и Angular»Учеников на курсе 17
Сертификаты, выданные на курсе «DOM без хаоса: системная база для React, Vue и Angular»Сертификатов выдано 1
Отзывы о курсе «DOM без хаоса: системная база для React, Vue и Angular»Отзывов получено 0
Рейтинг курса «DOM без хаоса: системная база для React, Vue и Angular»Рейтинг курса 0.000
Уроки в курсе «DOM без хаоса: системная база для React, Vue и Angular»Количество уроков 125
Тесты в курсе «DOM без хаоса: системная база для React, Vue и Angular»Количество квизов 45
Время прохождения курса «DOM без хаоса: системная база для React, Vue и Angular»Время прохождения курса —
Стоимость курса «DOM без хаоса: системная база для React, Vue и Angular»Стоимость курса 777 ₽ —
Обновления курса «DOM без хаоса: системная база для React, Vue и Angular»Обновления курса — —
Дата публикации курса «DOM без хаоса: системная база для React, Vue и Angular»Дата публикации курса — ———
Последнее обновление курса «DOM без хаоса: системная база для React, Vue и Angular»Последнее обновление — ———
Сложность easy — ———

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

Разделы в курсе «DOM без хаоса: системная база для React, Vue и Angular» 24 раздела Уроки в курсе «DOM без хаоса: системная база для React, Vue и Angular» 125 уроков Тесты в курсе «DOM без хаоса: системная база для React, Vue и Angular» 45 тестов Время прохождения курса «DOM без хаоса: системная база для React, Vue и Angular» 0 ч. Последнее обновление курса «DOM без хаоса: системная база для React, Vue и Angular» обн. 25 мая 2026

1. Начало

4 урока
Открытый
1.1 Вступление ↗
4
4
-
0
Открытый
1.2 Кому будет полезен этот курс и зачем понимать DOM ↗
6
5
-
0
Открытый
1.3 Темы которые нужно понимать перед прохождения курса ↗
7
7
-
0
Открытый
1.4 Подготовка перед прохождением курса ↗
4
3
-
0

2. Фундамент DOM

7 уроков
Открытый
2.1 Содержание модуля ↗
3
3
-
0
Открытый
2.2 Что такое DOM, Document и разница между HTML и DOM ↗
6
2
8м 26с
0
Закрытый
2.3 Узлы (Node) — основные типы ↗
1
1
11м 38с
0
Закрытый
2.4 DOM‑дерево: отношения между узлами ↗
1
1
-
0
Закрытый
2.5 Живое vs статическое поведение коллекций ↗
1
1
-
0
Закрытый
2.6 Тесты ↗
1
1
-
0
Закрытый
2.7 Практика ↗
1
1
-
0

3. Архитектура браузера и Web API

1 урок
Закрытый
3.1 DOM и Web API — как устроена архитектура браузера ↗
1
1
-
0

4. Базовые фундаментальные интерфейсы

4 урока
Закрытый
4.1 Все интерфейсы DOM — обзор ↗
1
1
-
0
Закрытый
4.2 EventTarget — основа событийной модели браузера ↗
1
1
-
0
Закрытый
4.3 Window — глобальный объект браузера ↗
1
1
-
0
Закрытый
4.4 Node — базовый интерфейс DOM ↗
1
1
-
0

5. Узлы документа

4 урока
Закрытый
5.1 Document — точка входа в DOM. Предоставляет весь HTML ↗
1
1
-
0
Закрытый
5.2 Document — работа с событиями ↗
1
1
-
0
Закрытый
5.3 DocumentType — паспорт вашего документа ↗
1
1
-
0
Закрытый
5.4 DocumentFragment — невидимый контейнер для быстрой вставки ↗
1
1
-
0

6. Элементы

6 уроков
Закрытый
6.1 Element — каркас любого тега ↗
1
1
-
0
Закрытый
6.2 Element — Геометрия, События, Анимация, ARIA ↗
2
1
-
0
Закрытый
6.3 HTMLElement — оживший HTML-объект ↗
1
1
-
0
Закрытый
6.4 HTML‑элементы. Часть 1 ↗
1
1
-
0
Закрытый
6.5 HTML‑элементы. Часть 2 ↗
1
1
-
0
Закрытый
6.6 HTMLMediaElement, HTMLAudioElement, HTMLVideoElement ↗
1
1
-
0

7. От теории интерфейсов к живому коду

2 урока
Закрытый
7.1 Практика ↗
1
1
-
0
Закрытый
7.2 База есть. Что дальше? ↗
1
1
-
0

8. Текстовые узлы

3 урока
Закрытый
8.1 CharacterData — базовый интерфейс текстовых узлов ↗
1
1
-
0
Закрытый
8.2 Text — интерфейс, представляющий текстовый узел ↗
1
1
-
0
Закрытый
8.3 Comment — комментарий ↗
0
0
-
0

9. Коллекции и списки

2 урока
Закрытый
9.1 DOMTokenList — упорядоченный набор строк‑токенов ↗
1
0
-
0
Закрытый
9.2 NodeList и HTMLCollection — коллекции узлов ↗
0
0
-
0

10. Обход DOM

2 урока
Закрытый
10.1 TreeWalker — ручной обход DOM ↗
0
0
-
0
Закрытый
10.2 NodeIterator — простой обход DOM ↗
0
0
-
0

11. Выделение и работа с диапазонами

2 урока
Закрытый
11.1 Range — диапазон в документе ↗
1
1
-
0
Закрытый
11.2 Selection — выделение текста ↗
0
0
-
0

12. Наблюдение за изменениями

1 урок
Закрытый
12.1 MutationObserver — отслеживание изменений DOM ↗
0
0
-
0

13. Shadow DOM и Web Components

3 урока
Закрытый
13.1 ShadowRoot — корень теневого DOM ↗
0
0
-
0
Закрытый
13.2 HTMLSlotElement — слот для вставки контента ↗
0
0
-
0
Закрытый
13.3 CustomElementRegistry — регистрация кастомных элементов ↗
1
1
-
0

14. Поиск и навигация

7 уроков
Закрытый
14.1 Содержание модуля ↗
1
0
-
0
Закрытый
14.2 Методы поиска: Где и как искать? ↗
1
1
-
0
Закрытый
14.3 Продвинутая проверка и движение «Вверх» ↗
1
1
-
0
Закрытый
14.4 Навигация: Как перемещаться без повторного поиска? ↗
1
1
-
0
Закрытый
14.5 Коллекции и работа с памятью ↗
1
1
-
0
Закрытый
14.6 Тесты ↗
1
1
-
0
Закрытый
14.7 Практика ↗
1
1
-
0

15. Создание, изменение и удаление элементов

10 уроков
Закрытый
15.1 Содержание модуля ↗
1
1
-
0
Закрытый
15.2 Рождение узлов: Работа в памяти ↗
1
1
-
0
Закрытый
15.3 Вставка: Как элементы попадают на страницу ↗
1
1
-
0
Закрытый
15.4 Очистка и замена: Современный подход ↗
1
1
-
0
Закрытый
15.5 Жизненный цикл: Удаление и Клонирование ↗
1
1
-
0
Закрытый
15.6 Оптимизация: DocumentFragment ↗
1
1
-
0
Закрытый
15.7 Жизнь после смерти: Утечки памяти и «призраки» ↗
1
1
-
0
Закрытый
15.8 Архитектурная заметка: Как это делают фреймворки (Vue/React) ↗
1
1
-
0
Закрытый
15.9 Тесты ↗
1
1
-
0
Закрытый
15.10 Практика ↗
1
1
-
0

16. Работа с содержимым и безопасностью

8 уроков
Закрытый
16.1 Содержание модуля ↗
1
0
-
0
Закрытый
16.2 Трио для работы с контентом: Выбираем оружие ↗
1
1
-
0
Закрытый
16.3 Точечная работа: Методы insertAdjacent... ↗
1
1
-
0
Закрытый
16.4 XSS (Cross-Site Scripting): Как не подставить проект ↗
1
1
-
0
Закрытый
16.5 Защита и «Песочницы» ↗
1
1
-
0
Закрытый
16.6 createTextNode — Золотой стандарт ↗
1
1
-
0
Закрытый
16.7 Тесты ↗
1
1
-
0
Закрытый
16.8 Практика ↗
1
1
-
0

17. Атрибуты, свойства, dataset

9 уроков
Закрытый
17.1 Содержание модуля ↗
1
0
-
0
Закрытый
17.2 Атрибуты vs Свойства: Фундаментальная разница ↗
1
1
-
0
Закрытый
17.3 Работа с атрибутами: Интерфейс Element ↗
1
1
-
0
Закрытый
17.4 DOM-свойства: Быстро и типизировано ↗
1
1
-
0
Закрытый
17.5 Dataset: Твой склад данных ↗
1
1
-
0
Закрытый
17.6 Стили и Классы: Специализированные интерфейсы ↗
1
1
-
0
Закрытый
17.7 Практическая работа: «Управление карточкой товара» ↗
1
1
-
0
Закрытый
17.8 Тесты ↗
1
1
-
0
Закрытый
17.9 Практика ↗
1
1
-
0

18. События — базовый уровень

9 уроков
Закрытый
18.1 Содержание модуля ↗
1
1
-
0
Закрытый
18.2 Способы назначения обработчиков ↗
1
1
-
0
Закрытый
18.3 Жизненный цикл подписки: Удаление событий ↗
1
1
-
0
Закрытый
18.4 Объект Event: Твои глаза и уши ↗
1
1
-
0
Закрытый
18.5 Главные события (Must-know на старте) ↗
1
1
-
0
Закрытый
18.6 Управление поведением: preventDefault и stopPropagation ↗
1
1
-
0
Закрытый
18.7 Продвинутые опции: once и passive ↗
1
1
-
0
Закрытый
18.8 Тесты ↗
1
1
-
0
Закрытый
18.9 Практика ↗
1
1
-
0

19. События — продвинутый уровень

9 уроков
Закрытый
19.1 Содержание модуля ↗
1
0
-
0
Закрытый
19.2 Путешествие события: Погружение и Всплытие ↗
1
1
-
0
Закрытый
19.3 Делегирование событий: target и closest() ↗
1
1
-
0
Закрытый
19.4 Pointer Events: Унификация (Mouse + Touch) ↗
1
1
-
0
Закрытый
19.5 Опции и современные события ↗
1
1
-
0
Закрытый
19.6 Память и производительность ↗
1
1
-
0
Закрытый
19.7 Практика: Итоговая таблица выбора ↗
1
1
-
0
Закрытый
19.8 Тесты ↗
1
1
-
0
Закрытый
19.9 Практика ↗
1
1
-
0

20. Современные Browser APIs

9 уроков
Закрытый
20.1 Содержание модуля ↗
1
1
-
0
Закрытый
20.2 Семья Observers: «Глаза» вашего приложения ↗
0
0
-
0
Закрытый
20.3 Плавность: requestAnimationFrame (rAF) ↗
0
0
-
0
Закрытый
20.4 Работа с URL и навигацией ↗
0
0
-
0
Закрытый
20.5 Хранение данных: Хронология и Типы ↗
0
0
-
0
Закрытый
20.6 Взаимодействие с системой: Clipboard API ↗
0
0
-
0
Закрытый
20.7 Итоговая таблица: Браузер vs Библиотеки ↗
1
1
-
0
Закрытый
20.8 Тесты ↗
1
1
-
0
Закрытый
20.9 Практика ↗
1
1
-
0

21. Работа с БД — продвинутый уровень

4 урока
Закрытый
21.1 IndexedDB: Тяжелая артиллерия браузера ↗
0
0
-
0
Закрытый
21.2 Понятие State (Состояние приложения) ↗
1
1
-
0
Закрытый
21.3 Синхронизация БД и Состояния ↗
0
0
-
0
Закрытый
21.4 Безопасность и Мета-данные ↗
0
0
-
0

22. Мини‑проекты

2 урока
Закрытый
22.1 Содержание модуля ↗
1
1
-
0
Закрытый
22.2 Практика ↗
1
1
-
0

23. Архитектура и чистый код

9 уроков
Закрытый
23.1 Содержание модуля ↗
1
1
-
0
Закрытый
23.2 Разделение ответственности (Separation of Concerns) ↗
0
0
-
0
Закрытый
23.3 Функции-утилиты: Твой мини-фреймворк ↗
0
0
-
0
Закрытый
23.4 Кэширование и оптимизация отрисовки ↗
0
0
-
0
Закрытый
23.5 Теги : Разметка отдельно от логики ↗
0
0
-
0
Закрытый
23.6 Компонентный подход на Vanilla JS ↗
0
0
-
0
Закрытый
23.7 Главные правила «Чистого DOM-кода» ↗
1
1
-
0
Закрытый
23.8 Тесты ↗
1
1
-
0
Закрытый
23.9 Практика ↗
1
1
-
0

24. Интеграция с backend (FastAPI / любой REST)

5 уроков
Закрытый
24.1 Интеграция с backend (Python + FastAPI) ↗
1
1
-
0
Закрытый
24.2 Интеграция с backend (Node.js + Express) ↗
1
1
-
0
Закрытый
24.3 Практика ↗
1
1
-
0
Закрытый
24.4 Структура курса (потом удалить) ↗
1
1
-
0
Закрытый
24.5 Следующий интерфейс ↗
1
1
-
0