Запуск JavaScript и DevTools
Разберите подключение script, консоль, строгий режим, let/const, примитивы и преобразование типов.
Практика: Создайте страницу расчёта стоимости заказа и исследуйте значения в DevTools.Программирование
JavaScript с нуля
Научиться создавать интерактивные интерфейсы. Полная программа, практические задания с автопроверкой, сохранение прогресса и именной сертификат.
14 900 ₽
- 16 тематических модулей
- 16 модулей · 48–64 часов
- Итоговый проект: одностраничное приложение с внешним API
- Практика и автоматическая проверка
- Именной сертификат с проверкой подлинности
При покупке 2 курсов скидка 10%, от 3 курсов — 15%.
Результат обучения
одностраничное приложение с внешним API
Инструменты: JavaScript ES2024+, DOM, Fetch API, Vite
Программа курса
Условия, циклы и функции
Изучите ветвления, for/of, while, declaration, expression и стрелочные функции. Отделите вычисление от интерфейса.
Практика: Напишите функции расчёта скидки, доставки и итоговой суммы с проверкой граничных значений.Массивы и методы коллекций
Разберите map, filter, find, some, every и reduce. Научитесь выбирать метод по ожидаемому результату.
Практика: Обработайте массив товаров: поиск, фильтрация, сортировка и итоговая стоимость корзины.Объекты и деструктуризация
Работайте со свойствами, вложенными объектами, spread/rest и копированием. Разберите ссылочную природу объектов.
Практика: Спроектируйте объект заказа и функции безопасного обновления его статуса и состава.DOM и события
Находите элементы, изменяйте текст и классы, создавайте узлы, обрабатывайте click/input/submit и всплытие событий.
Практика: Соберите интерактивный список задач с добавлением, завершением, удалением и счётчиком.Формы и доступная валидация
Соедините встроенные ограничения HTML и пользовательскую проверку. Показывайте ошибку рядом с полем и управляйте фокусом.
Практика: Создайте форму регистрации с проверкой email, пароля и согласия, доступную с клавиатуры.Асинхронность и Promise
Разберите event loop, Promise, async/await, try/catch и параллельные операции.
Практика: Смоделируйте загрузку данных с состояниями ожидания, успеха, пустого ответа и ошибки.Fetch API и REST
Отправляйте GET/POST, проверяйте response.ok, кодируйте JSON и отменяйте долгий запрос.
Практика: Подключите публичный API и создайте поиск с обработкой 404, таймаутом и повтором.Модули и сборка проекта
Используйте export/import, npm scripts, Vite и переменные окружения. Не помещайте секреты во frontend.
Практика: Разделите приложение на data, ui и state, настройте сборку и production preview.Состояние и архитектура интерфейса
Определите единый источник данных, чистый render и однонаправленное обновление состояния.
Практика: Добавьте фильтры и localStorage в список задач без дублирования состояния в DOM.Тестирование и качество
Пишите тесты функций, проверяйте DOM-сценарии, используйте ESLint и форматирование.
Практика: Покройте расчёты тестами и вручную проверьте приложение по матрице устройств и ошибок.Итоговое SPA с API
Объедините маршрутизацию состояния, API, формы, кеширование и доступность.
Практика: Создайте приложение-каталог с поиском, избранным, подробной карточкой, URL-состоянием и README.Клиентская маршрутизация
Материал разбирается через входные данные, алгоритм, состояние программы, наблюдаемый результат и оценку ограничений. Тема встраивается в итоговый проект и проверяется вместе с ранее созданными частями. В курсе «JavaScript с нуля» тема «Клиентская маршрутизация» считается освоенной только после создания предметного результата и его независимой проверки. Качество определяется корректностью алгоритма, читаемостью решения и тестами на граничных данных.
Практика: Создайте рабочий код и набор тестовых данных по теме «Клиентская маршрутизация». Покажите исходные данные, ход работы, обычный и граничный сценарии, затем исправьте найденную ошибку.Производительность браузера
Материал разбирается через входные данные, алгоритм, состояние программы, наблюдаемый результат и оценку ограничений. Тема встраивается в итоговый проект и проверяется вместе с ранее созданными частями. В курсе «JavaScript с нуля» тема «Производительность браузера» считается освоенной только после создания предметного результата и его независимой проверки. Качество определяется корректностью алгоритма, читаемостью решения и тестами на граничных данных.
Практика: Создайте рабочий код и набор тестовых данных по теме «Производительность браузера». Покажите исходные данные, ход работы, обычный и граничный сценарии, затем исправьте найденную ошибку.Безопасность frontend-приложения
Безопасность начинается с минимальных прав, проверки входа, защиты секретов, журналирования и резервного восстановления. Тема встраивается в итоговый проект и проверяется вместе с ранее созданными частями. В курсе «JavaScript с нуля» тема «Безопасность frontend-приложения» считается освоенной только после создания предметного результата и его независимой проверки. Качество определяется корректностью алгоритма, читаемостью решения и тестами на граничных данных.
Практика: Создайте рабочий код и набор тестовых данных по теме «Безопасность frontend-приложения». Покажите исходные данные, ход работы, обычный и граничный сценарии, затем исправьте найденную ошибку.Публикация и мониторинг SPA
Материал разбирается через входные данные, алгоритм, состояние программы, наблюдаемый результат и оценку ограничений. Финальный модуль объединяет программу курса в один воспроизводимый результат. В курсе «JavaScript с нуля» тема «Публикация и мониторинг SPA» считается освоенной только после создания предметного результата и его независимой проверки. Качество определяется корректностью алгоритма, читаемостью решения и тестами на граничных данных.
Практика: Соберите итоговую работу курса, применив тему «Публикация и мониторинг SPA». Представьте рабочий код и набор тестовых данных, инструкцию воспроизведения и отчёт проверки.