Онлайн-курс Frontend-разработчик
За 8 месяцев научитесь всему, что должен знать Frontend-разработчик. Результат обучения — сможете переводить готовый дизайн-макет в код так, чтобы все работало
За 8 месяцев научитесь всему, что должен знать Frontend-разработчик. Результат обучения — сможете переводить готовый дизайн-макет в код так, чтобы все работало
Программа 2025 года, обновляем уроки каждые 3 месяца
Поддержка личного наставника без ограничений по ответам
Поможем полностью подготовиться к поиску работы
2 итоговых проекта на реальных данных
Как мы создаем
хорошие курсы
Студенты учатся рядом с личным наставником и командой поддержки. Когда сложно и непонятно, к ним можно обратиться за поддержкой в личном чате
и много практики
В курсах ничего лишнего: только нужная теория и много практики, потому что без нее обучение равно нулю. Поэтому наши курсы короче и дешевле
Вам не нужно думать о том, что и где находится. На нашей платформе удобно учиться, всё под рукой: чат с наставником, задания и проекты
Frontend-разработчик отвечает за создание визуальной части веб-приложений и сайтов, то есть за всё, что видит и с чем взаимодействует пользователь в браузере.
Для этого он должен изучить HTML, CSS, JavaScript, популярные фреймворки и библиотеки для создания интерактивных интерфейсов. Этому мы научим на курсе
Сколько зарабатывает фронтенд-разработчик
По данным «Headhunter», средняя зарплата фронтенд-разработчика — 170 000 рублей. На старте разработчики получают от 50 до 150 тысяч рублей. Но это только примерный разброс, всё зависит от опыта, региона и компании.
Для кого этот курс
Начнёте карьеру разработчика во фронтенде, изучите основы HTML, CSS и JavaScript, создадите первые веб-страницы, которые можно будет положить в портфолио
Получите навыки, с которыми сможете уйти в другие проекты или сменить карьерное направление
О курсе
74900 ₽Более 9000 учеников
уже нашли работу
Сформируете личный карьерный план, прокачаете резюме и портфолио, подготовитесь к собеседованиям
С лучшими вакансиями и стажировками от наших партнёров
В формате текстового чата в Telegram. Он проверит резюме и портфолио, подскажет, как выделиться среди других кандидатов
Сервис, который помогает автоматизировать рассылку резюме
Это личный созвон, на котором вам дадут индивидуальные рекомендации и поддержку в поиске работы
Сервис, который помогает автоматизировать рассылку резюме
Остались вопросы?
Оставьте заявку на бесплатную консультацию
и мы поможем определиться с выбором
Практика на
больших проектах
Чему вы научитесь
на курсе
Чему вы научитесь
на курсе
- HTML — язык разметки, на котором строятся сайты
- CSS — язык стилей для оформления документа
- Github — облачный сервис для работы над кодом в команде
- Сетевые технологии и протоколы — TCP/IP, HTTP, HTTPS, FTP
- JavaScript — с его помощью сайты делают интерактивными
- Node.js — среда выполнения кода JavaScript вне браузера
- Основы React — библиотека для разработки интерфейсов
- Основы Typescript — язык программирования основанный на JS
- Figma/Adobe Photoshop — графические редакторы для вёрстки сайтов
в вашем резюме!
Тарифы
- Самостоятельное обучение без наставника
- Доступ на длительность курса (указан на сайте)
- Сертификат Школы
- Бонус: доступ к курсу «Учись учиться»
- Личный наставник без ограничения по ответам
- Неограниченный доступ к курсу
- Работа с проектами
- Две онлайн-консультации с наставником
- Помощь с трудоустройством
- Закрытое комьюнити менторов и выпускников
- Сертификат Школы + удостоверение о повышении квалификации
- Всё из тарифа «Оптимальный»
- Онлайн-консультации с наставником после каждого модуля
- Дополнительные проекты для портфолио
- Личная карьерная консультация с экспертом
Что еще важно?
Можно оплатить в рассрочку через Сбер и Т-банк или частями через Сплит. Проценты и переплаты берем на себя
Команда поддержки поможет вам получить обратно 13% стоимости курса
Если вам что-то не понравилось, вернем всю сумму в течение месяца после оплаты
Программа курса
- Что такое сайт и способы его создания
- Как устроен Интернет
- Этапы создания сайта
- Основные инструменты веб-разработчика
- Валидность кода, валидаторы
- Git и GitHub
- Создание первой HTML-страницы
В этом модуле вы поймёте, что такое сайт и как его создать. Узнаете, как устроен интернет и взаимодействуют клиент с сервером. Разберётесь в ролях команды разработки и этапах работы над проектом. Освоите базовые инструменты веб-разработчика и напишете свою первую HTML-страницу
- Семантические теги для структуры страницы
- Создание и настройка гиперссылок
- Работа с нумерованными и маркированными списками
- Вставка изображений, видео и аудио
- Практическая вёрстка страницы с навигацией и карточками
В этом модуле вы научитесь создавать правильную структуру страницы, добавлять ссылки и медиа, оформлять контент списками. Сверстаете страницу с использованием всех изученных тегов
- Подключение стилей
- Основные свойства оформления
- Стилизация текста
- Принципы каскадности
- Практическое применение
В этом модуле вы освоите подключение CSS, научитесь задавать стили элементам и тексту, поймете логику наследования свойств
- Многоколоночные макеты
- Блочные и строчные элементы
- Основы Flexbox: оси, выравнивание, перенос
- Создание адаптивных колонок
- Практика: вёрстка карточек и сеток
- Комбинирование технологий
В этом модуле вы научитесь создавать сложные макеты с помощью Flexbox. Поймёте разницу между блочными и строчными элементами. Освоите принципы построения колонок и адаптивных сеток
- Знакомство с интерфейсом Figma
- Работа с готовыми макетами
- Подготовка к вёрстке
- Пошаговая вёрстка простого макета
- Использование инструментов разработчика
В этом модуле вы научитесь работать в Figma, анализировать готовые макеты и правильно подготавливать проект к вёрстке. Освоите процесс переноса дизайна в код
- Абсолютное и относительное позиционирование
- Фиксированное и sticky-позиционирование
- Управление слоями через z-index
- Контексты наложения элементов
В этом модуле вы научитесь контролировать расположение элементов на странице. Освоите техники наложения объектов и создания «липких» элементов. Поймёте разницу между типами позиционирования и их практическое применение
- Поля ввода и их виды
- Чекбоксы и радиокнопки
- Выпадающие списки с вариантами
- Оформление форм
В этом модуле вы научитесь создавать формы для сбора данных пользователей. Узнаете, как работать с разными типами полей ввода, группировать радиокнопки и чекбоксы. Освоите вёрстку выпадающих списков и профессиональное оформление форм с помощью CSS, включая кастомные стили для сложных элементов
- Зачем нужна адаптивность и как она влияет на пользователей?
- Медиа-запросы
- Viewport и настройка области просмотра для мобильных устройств
- Кроссбраузерная вёрстка
- Инструменты тестирования
В этом модуле вы научитесь создавать сайты, которые корректно отображаются на любых устройствах. Освоите медиазапросы и два подхода к адаптивной вёрстке. Узнаете, как добиться одинакового отображения сайта во всех браузерах. Познакомитесь с профессиональными инструментами тестирования адаптивности и кроссбраузерности
- Плавные переходы между состояниями
- Создание сложных анимаций через @keyframes
- Трансформации элементов
- Практические примеры использования
В этом модуле вы научитесь создавать плавные переходы, многоэтапные анимации и преобразовывать элементы. Узнаете, где применять анимации в реальных проектах
- Введение JavaScript
- Переменные и типы данных
- Математические операторы и преобразование типов
- Логические операторы
- Ветвления и условные операторы
- Встроенные функции для взаимодействия с пользователем
В этом модуле вы познакомитесь с основами JavaScript, научитесь работать с переменными и типами данных, освоите основные операторы и научитесь создавать простые интерактивные сценарии
- Циклы и массивы в JavaScript
- Основы работы с массивами
- Методы массивов: добавление и удаление элементов
- Использование циклов for и while
- Работа с вложенными массивами
- Отладка кода через консоль
В этом модуле вы научитесь создавать и модифицировать массивы, освоите работу с циклами для обработки данных, познакомитесь с методами поиска элементов
- Основы функций и стрелочные функции
- Работа с оператором return
- Области видимости переменных
- Замыкания и отложенное выполнение
- Функции обратного вызова
В этом модуле вы научитесь создавать и использовать функции, освоите работу с областями видимости и замыканиями, поймете принцип работы колбэков
- Работа с объектами
- Конструкторы и наследование
- Взаимодействие с DOM
- Обработка событий
В этом модуле вы научитесь создавать и работать с объектами, освоите принципы наследования, изучите методы работы с DOM и обработки событий
- Виды веб-анимаций и их применение
- Оптимизация рендеринга анимаций
- Работа с Web Animations API
- Популярные анимационные библиотеки
В этом модуле вы изучите различные подходы к созданию анимаций, научитесь оптимизировать их производительность и освоите современные инструменты для работы с анимациями
- Объявление переменных через let/const
- Деструктуризация массивов и объектов
- Методы работы с массивами
- Синтаксис классов ES6
- Наследование классов
В этом модуле вы изучите современные подходы к работе с переменными, освоите деструктуризацию и методы массивов, научитесь создавать классы и их иерархии
- Основы Node.js и его модули
- Работа с NPM и package.json
- Настройка Webpack для сборки проектов
- Использование загрузчиков и плагинов
В этом модуле вы познакомитесь с серверным JavaScript, научитесь управлять зависимостями через NPM, освоите базовую настройку Webpack
- Отправка запросов через XMLHttpRequest
- Использование Promise для асинхронных операций
- Современный метод fetch
- Синтаксис async/await
В этом модуле вы научитесь взаимодействовать с сервером, освоите различные методы отправки запросов и обработки ответов
- Основы фреймворков
- Создание сервера и роутинг
- Работа с API и шаблонизаторами
- Хранение данных с ORM
В этом модуле вы освоите создание серверных приложений на Express JS, научитесь работать с маршрутами, API и базами данных
- Компоненты и JSX
- Обработка событий и хуки
- Управление состоянием
- Стилизация компонентов
- Маршрутизация с React Router
В этом модуле вы научитесь создавать компоненты, управлять их состоянием и стилизацией. Освоите маршрутизацию для одностраничных приложений
- Статическая типизация
- Перечисления и типы массивов
- Интерфейсы и пользовательские типы
- Обобщённые типы
В этом модуле вы познакомитесь с основами TypeScript, научитесь работать с типами данных и создавать гибкие структуры
- Введение в управление состоянием
- Основные принципы Redux
- Работа с Redux Toolkit
- Интеграция с TypeScript
- Дорожная карта разработчика
В этом модуле вы познакомитесь с Redux как инструментом управления состоянием, научитесь использовать Redux Toolkit для упрощения работы и освоите интеграцию с TypeScript
- Постановка реалистичной карьерной цели
- Самооценка и анализ профессионального пути
- Разбор нетипичных случаев: долгий перерыв в работе, декрет, смена трека
- Создание резюме, которое понравится рекрутерам
- Анализ рынка и поиск вакансий
- Адаптация сопроводительного письма
- Подготовка к собеседованию с HR и командой
Поймёте возможности рынка и выберете варианты на основе интересов и опыта. Узнаете, как описать свои достижения с учётом всех нюансов. Научитесь интересно рассказывать о себе и своём опыте
Мы обучили
25 000+ специалистов
О Бруноям
Бруноям — это практический подход к образованию. Мы делаем курсы для тех, кто хочет получить новую профессию, сменить сферу деятельности или решить свою бизнес-задачу. На собеседовании стали спрашивать не наличие диплома, а навыки, которыми человек обладает. Мы в Бруноям как раз и даём те самые навыки и умения, которые позволяют попробовать себя в новой профессии или совершенствоваться. Мы делаем образование для тех, кто хочет и готов пробовать новое, меняться, искать себя и свою работу мечты
Вопросы и ответы
Мы помогаем сделать хорошее резюме, оформить портфолио, подготовиться к собеседованиям. Каждый студент может обратиться за помощью к экспертам из карьерного центра Бруноям.
Образовательная деятельность в Школе Бруноям ведется на основании государственной лицензии.
Вы можете оформить налоговый вычет, если вы работаете по трудовому договору и являетесь налоговым резидентом РФ.
Чтобы получить налоговый вычет за обучение, нужно собрать документы, включая договор с учебным заведением и чеки об оплате, и подать декларацию 3-НДФЛ в налоговую инспекцию. Вычет можно оформить за себя или близких родственников. Для получения вычета через работодателя подайте заявление и справку об оплате в налоговую через личный кабинет на сайте ФНС. Возврат составит 13% от суммы расходов на обучение.
Вы всегда можете спросить про налоговый вычет у наших менеджеров — они помогут разобраться в процессе.
Подробнее о налоговом вычете читайте в нашей статье.
Вы можете спланировать свой бюджет и оплатить курс разными способами:
- У нас есть беспроцентная рассрочка от Т-банк и Сбербанк. Проценты Школа берёт на себя.
- Принимаем оплаты иностранными картами.
- Доступна оплата частями через сервис Яндекс Сплит. Можно разделить оплату на 2, 4, 6 месяцев.
- Обучение может оплатить ваш работодатель: заключаем договор с юрлицом, выставляем счёт на оплату, после открываем доступ к курсу.
Рядом с вами будут эксперты в профессии — преподаватели и наставники. Они помогут систематизировать знания, расскажут об инструментах и возможностях, доведут ваши проекты до ума, чтобы у вас было хорошее портфолио.
English
РусскийРезультативность, Добро и Юмор! Их нам вполне хватает, чтобы на каждом этапе максимально удовлетворить наших учеников и довести их до результата.
