Разработчик веб и мультимедийных приложений
Программа профессиональной переподготовки «Frontend‑разработка на JavaScript (React.js)» предназначена для тех, кто хочет стать frontend‑разработчиком и создавать современные, интерактивные веб‑интерфейсы. Обучение охватывает полный стек технологий – от вёрстки и JavaScript до создания SPA‑приложений на React. Всё обучение построено на практике и работе над проектами.
Программа соответствует требованиям ФГОС СПО 09.02.07 «Информационные системы и программирование» и разработана с учётом положений профессионального стандарта 06.035 «Разработчик WEB и мультимедийных приложений».
Формат обучения
Обучение проводится в группе в онлайн‑формате по расписанию – понедельник и четверг с 19:00 до 21:10 по московскому времени (по 2 академических пары).
Период обучения – с 1 сентября 2025 года по 15 февраля 2026 года, с учётом праздничных и выходных дней.
По желанию обучение доступно в персональном формате (1 на 1 с преподавателем).
Структура и объём обучения
Программа включает 4 модуля по 40 академических часов занятий с преподавателем.
Общий объём – 256 академических часов, из которых:
▪ 160 часов – онлайн‑занятия с преподавателем
▪ 96 часов – самостоятельная работа и выполнение практических заданий
Документ по окончании
📜 Диплом о профессиональной переподготовке – при наличии среднего профессионального или высшего образования
📜 Сертификат о прохождении курса – при несоответствии требуемому уровню образования
Содержание
- 4 модуля
- 160 уроков
- 160 часов
- Модуль 1. Разработка WEB-страниц на HTML и CSS40
- 1.1Введение в веб-разработку и структура HTML-документа
- 1.2Практическая работа №1. Создание базовой HTML-страницы
- 1.3Работа с текстом в HTML
- 1.4Практическая работа №2. Разметка текста и списков на веб-странице
- 1.5Работа с изображениями, ссылками и медиа
- 1.6Практическая работа №3. Создание страницы с мультимедийным контентом
- 1.7Формы и пользовательский ввод
- 1.8Практическая работа №4. Создание формы регистрации
- 1.9Основы CSS и стилизация текста
- 1.10Практическая работа №5. Применение CSS к тексту и заголовкам
- 1.11Блочная модель и размеры элементов
- 1.12Практическая работа №6. Создание многоуровневой структуры страницы
- 1.13Расположение элементов и Flexbox
- 1.14Практическая работа №7. Создание адаптивного блока с Flexbox
- 1.15Сетка CSS Grid
- 1.16Практическая работа №8. Создание сетки для страницы
- 1.17Медиа-запросы и адаптивность
- 1.18Практическая работа №9. Адаптация страницы под мобильные устройства
- 1.19CSS-анимации и переходы
- 1.20Практическая работа №10. Добавление анимации к кнопке
- 1.21Введение в SCSS и препроцессоры
- 1.22Практическая работа №11. Работа с SCSS
- 1.23Работа с иконочными шрифтами и SVG
- 1.24Практическая работа №12. Использование иконок на веб-странице
- 1.25Темизация сайтов (темная и светлая темы)
- 1.26Практическая работа №13. Создание переключателя тем
- 1.27Основы взаимодействия HTML и JavaScript
- 1.28Практическая работа №14. Изменение стиля страницы через JS
- 1.29Валидация форм с помощью JavaScript
- 1.30Практическая работа №15. Реализация валидации формы
- 1.31Основы работы с макетами Figma
- 1.32Практическая работа №16. Анализ макета Figma
- 1.33Верстка по макету Figma
- 1.34Практическая работа №17. Верстка макета из Figma
- 1.35Оптимизация верстки
- 1.36Практическая работа №18. Оптимизация готовой страницы
- 1.37Публикация сайта в интернете
- 1.38Практическая работа №19. Размещение сайта в интернете
- 1.39Итоговый проект по разработке веб-страниц
- 1.40Практическая работа №20. Разработка итогового проекта
- Модуль 2. Программирование на языке JavaScript40
- 2.1Введение в JavaScript и настройка окружения
- 2.2Практическая работа №1. Подключение JavaScript и работа в консоли
- 2.3Переменные и типы данных в JavaScript
- 2.4Практическая работа №2. Работа с переменными и преобразование типов
- 2.5Операторы и выражения в JavaScript
- 2.6Практическая работа №3. Использование операторов и выражений
- 2.7Условные конструкции и ветвления
- 2.8Практическая работа №4. Написание условных конструкций
- 2.9Циклы в JavaScript
- 2.10Практическая работа №5. Создание циклических алгоритмов
- 2.11Функции в JavaScript
- 2.12Практическая работа №6. Написание пользовательских функций
- 2.13Работа с областями видимости и контекстом this
- 2.14Практическая работа №7. Работа с this и контекстом функций
- 2.15Массивы и их методы
- 2.16Практическая работа №8. Работа с массивами и методами обработки данных
- 2.17Объекты в JavaScript
- 2.18Практическая работа №9. Создание и работа с объектами
- 2.19Деструктуризация и spread/rest-операторы
- 2.20Практическая работа №10. Использование деструктуризации и spread/rest
- 2.21Основы работы с DOM
- 2.22Практическая работа №11. Манипуляция DOM-элементами
- 2.23Обработчики событий в JavaScript
- 2.24Практическая работа №12. Работа с обработчиками событий
- 2.25Таймеры и задержки
- 2.26Практическая работа №13. Работа с таймерами и задержками
- 2.27Промисы и работа с асинхронным кодом
- 2.28Практическая работа №14. Создание и работа с промисами
- 2.29Async/Await и обработка данных
- 2.30Практическая работа №15. Использование fetch() и async/await
- 2.31Модули в JavaScript (import/export)
- 2.32Практическая работа №16. Работа с модулями JavaScript
- 2.33Работа с localStorage и sessionStorage
- 2.34Практическая работа №17. Хранение пользовательских данных
- 2.35Работа с API и JSON
- 2.36Практическая работа №18. Запрос к API и отображение данных
- 2.37Оптимизация кода и рефакторинг
- 2.38Практическая работа №19. Рефакторинг кода проекта
- 2.39Итоговый проект
- 2.40Практическая работа №20. Финальный проект
- Модуль 3. JavaScript для frontend-разработки40
- 3.1Глубже в JavaScript: продвинутая работа с переменными и типами данных
- 3.2Практическая работа №1. Исследование типов данных и областей видимости
- 3.3Callback-функции и функциональное программирование
- 3.4Практическая работа №2. Работа с callback-функциями
- 3.5Работа с массивами: продвинутые методы
- 3.6Практическая работа №3. Фильтрация и сортировка данных в массиве
- 3.7Объекты, прототипное наследование и классы
- 3.8Практическая работа №4. Создание классов и работа с объектами
- 3.9DOM-дерево и его манипуляция
- 3.10Практическая работа №5. Динамическое изменение веб-страницы с помощью JS
- 3.11Работа с событиями в браузере
- 3.12Практическая работа №6. Добавление обработчиков событий на страницу
- 3.13Анимации и стилизация элементов через JavaScript
- 3.14Практическая работа №7. Создание динамической анимации на JS
- 3.15Основы jQuery: подключение и селекторы
- 3.16Практическая работа №8. Работа с селекторами jQuery
- 3.17События в jQuery
- 3.18Практическая работа №9. Работа с событиями в jQuery
- 3.19Эффекты и анимации в jQuery
- 3.20Практическая работа №10. Добавление анимаций с jQuery
- 3.21Работа с AJAX и JSON в JavaScript
- 3.22Практическая работа №11. Запрос данных с API и их отображение на странице
- 3.23AJAX-запросы в jQuery
- 3.24Практическая работа №12. Получение данных с сервера через AJAX
- 3.25Работа с localStorage и sessionStorage
- 3.26Практическая работа №13. Реализация локального хранения данных
- 3.27Работа с модулями ES6
- 3.28Практическая работа №14. Подключение и работа с модулями
- 3.29Работа с асинхронными операциями (Async/Await)
- 3.30Практическая работа №15. Написание асинхронного запроса к API
- 3.31Ошибки и их обработка в JavaScript
- 3.32Практическая работа №16. Обработка ошибок в JavaScript
- 3.33Оптимизация кода и рефакторинг
- 3.34Практическая работа №17. Рефакторинг и оптимизация JS-кода
- 3.35Взаимодействие фронтенда и бэкенда
- 3.36Практическая работа №18. Создание взаимодействия между клиентом и сервером
- 3.37Итоговая валидация и тестирование кода
- 3.38Практическая работа №19. Финальная отладка проекта
- 3.39Итоговый проект по frontend-разработке
- 3.40Практическая работа №20. Финальный проект
- Модуль 4. Разработка на фреймворке React.js40
- 4.1Введение в React.js и создание первого проекта
- 4.2Практическая работа №1. Создание первого React-приложения
- 4.3JSX и основы работы с компонентами
- 4.4Практическая работа №2. Создание и использование компонентов
- 4.5Работа с пропсами и состоянием (props & state)
- 4.6Практическая работа №3. Управление состоянием с useState
- 4.7Основы хуков (hooks) в React
- 4.8Практическая работа №4. Работа с useEffect и управлением жизненным циклом
- 4.9Работа с событиями в React
- 4.10Практическая работа №5. Реализация интерактивных элементов
- 4.11Использование CSS-модулей и стилизация компонентов
- 4.12Практическая работа №6. Добавление стилизации в React-приложение
- 4.13Управление списками и рендеринг данных
- 4.14Практическая работа №7. Создание динамических списков
- 4.15Контролируемые и неконтролируемые компоненты
- 4.16Практическая работа №8. Создание формы с контролируемыми компонентами
- 4.17React Router: основы навигации
- 4.18Практическая работа №9. Реализация маршрутизации в React-приложении
- 4.19Работа с REST API в React
- 4.20Практическая работа №10. Загрузка данных с API и их отображение
- 4.21Управление состоянием с Redux
- 4.22Практическая работа №11. Реализация управления состоянием с Redux
- 4.23Работа с контекстом (Context API)
- 4.24Практическая работа №12. Использование Context API в React-приложении
- 4.25Оптимизация рендеринга компонентов
- 4.26Практическая работа №13. Оптимизация производительности React-компонентов
- 4.27Ленивая загрузка компонентов
- 4.28Практическая работа №14. Реализация ленивой загрузки компонентов
- 4.29Тестирование React-приложений
- 4.30Практическая работа №15. Написание тестов для компонентов React
- 4.31Работа с анимацией в React
- 4.32Практическая работа №16. Создание анимированного React-интерфейса
- 4.33Подключение Firebase в React-приложении
- 4.34Практическая работа №17. Интеграция Firebase в React-приложение
- 4.35Работа с WebSockets (Socket.io)
- 4.36Практическая работа №18. Реализация чата с WebSockets
- 4.37Деплой React-приложения
- 4.38Практическая работа №19. Деплой React-приложения
- 4.39Итоговый проект по React.js
- 4.40Практическая работа №20. Финальный проект
Да. Программа построена с нуля и идеально подходит для начинающих.
Занятия проводятся онлайн в группе – с 19:00 до 21:10 по московскому времени.
HTML, CSS, JavaScript, jQuery, React.js, взаимодействие с API, маршрутизация, стилизация, деплой, тестирование и проекты.
Официальный диплом о профессиональной переподготовке или сертификат – в зависимости от вашего образования.
Требования
- Уверенное владение компьютером – работа с браузером, файловой системой и онлайн‑сервисами
- Доступ в интернет
- Знания в программировании не требуются – всё объясняется с нуля
Особенности
- Создадите полноценную веб‑страницу с нуля – с использованием HTML5, CSS3, Flexbox, Grid и адаптивной верстки
- Овладеете JavaScript – переменные, функции, DOM, асинхронность, массивы, объекты, API и работа с JSON
- Изучите инструменты frontend‑разработки – jQuery, работа с событиями, localStorage, AJAX‑запросы, валидация форм
- Освоите React.js – создание компонентов, работа с состоянием, маршрутизация, хуки, Redux, Context API
- Разработаете и задеплоите SPA‑приложение – подключение внешних сервисов, тестирование, оптимизация и публикация проекта
Целевая аудитория
- Новички, желающие войти в frontend‑разработку
- Студенты и выпускники, осваивающие востребованную IT‑специальность
- Специалисты из других областей, переходящие в веб
- Те, кто хочет получить системное обучение и создать проект под портфолио