Frontend-разработка

Познакомьтесь с разработкой веб-приложений на основе JavaScript, React и Redux. Научитесь самостоятельно разрабатывать веб-приложения, работать с REST API для интеграции с сервером, использовать тесты для контроля качества и разворачивать приложение для всеобщего доступа.
Когда:
01 Июля — 08 Августа
Формат:
Онлайн
Стоимость:
23 400 ₽

Ограниченное предложение

Подпишитесь на наши соцсети и получите скидку 10%
26 000 ₽
23 400 ₽

Кому идеально подойдет этот курс?

Кто учится
Кто учится
Если Вы получаете образование и хотите выгодно отличаться при устройстве на работу, открыть возможность дополнительного или даже основного заработка.
Кто начинает
Кто начинает
Если у Вас ещё нет опыта, на курсе можно познакомиться с профессиональным SMM и понять насколько это направление актуально.
Кто работает
Кто работает
Если Вы уже работаете по техническому профилю и хотите освоить новую для себя сферу деятельности.
Востребованность профессии Frontend-разработчика возрастает на протяжении последних 5 лет. Число digital-компаний растёт. Традиционные виды организаций создают веб-площадки для ведения бизнеса. Специалистов, способных профессионально заниматься клиентской частью пользовательского интерфейса, найти трудно, поэтому заработок специалистов растёт. Frontend-разработчик может иметь доход от 60 тыс. ₽ в месяц на первом этапе и за три года выйти на уровень от 120 тыс. ₽ и выше.

(по данным группы компаний hh.ru)
~130 000 ₽
Средняя зарплата Frontend-разработчика за 2018 г.
  • 75 Пульс нашего выпускника после устройства
    на работу
  • Выпускной проект
  • 100% прокачки
    скиллов
  • > 100 000 ваш будущий заработок
  • Стоимость 26000 руб.
  • 120+ довольных
    выпускников

Что вы изучите?

1неделя
Элементы React. Стилизация
Особенности одностраничных приложений. Основы использования консоли. Создание проекта с create-react-app. Структура проекта. Основы git. Разметка Jsx. Использование дочерних элементов в JSX. Предотвращение атак, основанных на инъекции кода. Рендеринг элемента в DOM. Компоненты и пропсы. Формы и ввод данных. Стилизация приложения.
2+2 часов практики
2+3 часов теории
Подробнее

Вебинар [2 часа]. Первый проект на React


Задача. Установка инструментов разработки
Задача. Создание нового проекта
Задача. Загрузка проекта на github
Задача. Отправка ссылки на проект преподавателю
Видео-лекция. "Как я перестал верить технологиям"
Статья. "
React JavaScript - библиотека для создания пользовательских интерфейсов"
Статья. "Как стать React разработчиком в 2018 году "
Книга. React.js для начинающих "Локальный сервер", "Подключаем React"

Вебинар [2 часа]. Элементы React. Стилизация


Задача. Создать домашнюю страницу
Задача. Создать страницы авторизации и регистрации
Статья. "React.js: понятное руководство для начинающих"
Статья. "Причины популярности React, ReactDOM и JSX"
Видео-лекция. Как остаться "пригодным верстальщиком"
Книга. React и Redux функциональная веб-разработка "Чистый React"
Книга.  React.js для начинающих "Использование props", "Порефакторим..."

Тест. Основные понятия React
2неделя
Навигация. Ядро приложения ToDo
Домашняя страница, страницы авторизации и регистрации, динамическая навигация и защищенные страницы. Компоненты React-router. Дописываем роуты. Активная ссылка. Основные компоненты ToDo приложения. Тестирование функционала с jest.
2+4 часов практики
2+2 часов теории
Подробнее

Вебинар [2 часа]. Навигация


Задача. Добавить навигацию между страницами
Задача. Добавление обработчика событий
Видео-лекция. "Как стать Junior JavaScript разработчиком"
Статья. "React JavaScript - библиотека для создания пользовательских интерфейсов"
Книга.  React.js для начинающих  "
Жизненный цикл компонента"
Книга. React+Redux+React-router "Подключаем React-router"

Вебинар [2 часа]. Ядро приложения ToDo


Задача. Создать простую функциональность для ToDo приложения
Задача. Добавить м
еханизмы быстрого перехода к нужному контенту
Статья. "Применение принципов SOLID при разработке React-приложений"
Видео-лекция. "Как стать Junior JavaScript разработчиком"
Книга.  React и Redux функциональная веб-разработка "Свойства, состояние и дерево компонентов"

Тест. Навигация в React

3неделя
Взаимодействие с сервером. Отображение загрузчиков.
Асинхронные операции в JavaScript, Promises. Код React, отображаемый на сервере. Клиент-серверное взаимодействие в React с Fetch API. Жизненный цикл React компонент. Отображение процесса выполнения асинхронных операций на интерфейсе.
3+3 часов практики
1+4 часов теории
Подробнее

Вебинар [2 часа]. Взаимодействие с сервером. Асинхронные операции


Задача. Интеграция с серверным API
Задача. Настройка универсальной маршрутизации
Видео-лекция. "Илья Климов — 30: слишком много JavaScript"
Статья. "
Нянчим проект на React-redux с пелёнок"
Книга. React и Redux функциональная веб-разработка "React и сервер"

Вебинар [2 часа]. Отображение загрузчиков. Дополнительные библиотеки


Задача. Добавить индикаторы загрузки
Задача. Рефакторинг селекторов и работы с коллекциями
Видео-лекция. "
Рендеринг на стороне сервера"
Статья. "React JavaScript - библиотека для создания пользовательских интерфейсов"
Книга. React.js для начинающих "Контролируемые компоненты"

Тест. Асинхронные операции
4неделя
Redux
Основные компоненты библиотеки Redux. Создание actions. Настройка Store. Создание Reducer. Инструменты React-разработчика. Иммутабельность данных. Усилители. Логгер. Reselect.
3+2 часов практики
1+3 часов теории
Подробнее

Вебинар [2 часа]. Redux


Задача. Перенести приложение на Redux структуру
Задача. Добавить вызов actions из компонентов
Видео-лекция. "Сколько наших сайтов останется в интернете, когда нам стукнет 60"
Статья. "
Редакс в реальной жизни"
Статья. "React JavaScript - библиотека для создания пользовательских интерфейсов"
Книга. Основы Redux "Настройка Store", "Создание Reducer"

Вебинар [2 часа]. Иерархические структуры


Задача. Добавить иерархические ToDo элементы
Задача. Реализовать механизм хранения сведений о том, «вошёл» ли пользователь в систему или нет
Статья. "Getting Started with Redux"
Видео-лекция. "Как быть хорошим фронтенд-разработчиком"
Книга. Основы Redux "Наводим порядок" 
Книга. React + Redux + React-router "Store.dispatch редирект"


Тест. Структуры Redux

5неделя
Redux middleware. Features
Обработка сетевых ошибок и отображение индикаторов загрузки средствами Redux. Дополнительные продвинутые темы. Поиск среди ToDo. Фильтры и сортировки. Оптимизация производительности. Виртуализация длинных списков. Использование рендер-пропа для сквозных задач.
3+2 часов практики
1+3 часов теории
Подробнее

Вебинар [2 часа]. Redux усилители


Задача. Добавить обработку ошибок
Задача. Создать middleware для роутинга
Видео-лекция. "
Связующий код middleware в Redux"
Статья. "Предохранители"
Статья. "Фрагменты"
Книга. Основы Redux "Middleware (Усилители). Логгер"

Вебинар [2 часа]. Продвинутые темы


Задача. Добавить сквозную функциональность с помощью НОС
Задача. Максимизировать композитивность
Задача. Оптимизация производительности. Виртуализация длинных списков
Видео-лекция. Архитектура сложных приложений на Redux (React.js)
Статья. Использование рендер-пропа для сквозных задач
Книга. React и Redux функциональная веб-разработка "Усовершенствование компонентов"

Тест. Redux middleware
6неделя
Публикация приложения. Разбор успешных проектов
Развертывание приложения в облаке heroku. Разбор решений и анализ распространенных ошибок.
3+2 часов практики
1+3 часов теории
Подробнее

Вебинар [2 часа]. Публикация приложения


Задача. Собрать все модули в один проект. Тестирование основных компонент
Задача. Публикация проекта на heroku
Видео-лекция. Установка и настройка Heroku
Статья. "
Развертывание на Heroku Cloud"
Статья. "Переходим на Heroku"
Книга. React и Redux функциональная веб-разработка "Тестирование"


Вебинар [2 часа]. Обзор и разбор лучших проектов


Задача. Создание пользовательских хуков
Задача. Р
азбор самых популярных ошибок и предостережения
Статья. "Вопросы для собеседования javascript разработчика"
Статья. "Философия React"
Книга. Основы Redux "Взаимодействуем с VK"

Тест. Публикация приложения

ЧТО БУДЕТ НА КУРСЕ?

Занятия с экспертами
Занятия ведут практикующие эксперты в digital-индустрии. Они в доступной форме рассказывают о сложных технологиях и инструментах.
Занятия с экспертами
Практические кейсы
Практические кейсы
Задача за 6 недель помочь вам погрузиться в область, разобрать вместе конкретные практические кейсы и отрыть возможность к самостоятельному развитию по выбранному направлению.
Онлайн-консультации
Мы ценим ваше время и онлайн-формат позволяет избежать дополнительных издержек на организацию обучения. Вы можете совмещать программу с работой и заниматься где удобно.
Онлайн-консультации
Тестирование
Тестирование
Базовым понятиям мы уделяем время необходимое и достаточное, чтобы эффективно решать практические задачи. Для закрепления пройденного материала мы подготовили тесты.
Выпускной проект "Разработка React+Redux приложения"
Проект содержит 3 страницы (авторизация, регистрация, домашняя страница). Будет реализована навигация между страницами. Проект публикуется на GitHub. Реализация отображения ToDo, создание, удаление (опциональная редакция). Загрузка данных и авторизация через rest api. Отображение лоадеров во время загрузки. Поддержка возможности ToDo иметь дочерние ToDo. Организация хранение данных в Redux. Корректная обработка сетевых ошибок.
Выпускной проект "Разработка React+Redux приложения"

ЧТО ВЫ ПОЛУЧИТЕ В РЕЗУЛЬТАТЕ?

Frontend-разработка
Вы научитесь
  • Создавать с нуля современные web приложения с React
  • Контролировать хранение и изменение данных в приложении с Redux
  • Выстраивать взаимодействие с Rest api сервера

Навыки, которые вы освоите
  • Создавать динамические страницы с React
  • Объединять страницы навигацией с react-router
  • Получать и редактировать данные с сервера с fetch api
  • Анимировать процесс загрузки и обрабатывать ошибки асинхронных операций
  • Разворачивать проект для публичного доступа на heroku
Инструменты которые вы освоите
GitHub
React
React Router
Redux
Heroku
GitHub
Крупнейший веб-сервис для хостинга IT-проектов и их совместной разработки. Веб-сервис основан на системе контроля версий Git.
React
JavaScript библиотека для создания пользовательского интерфейса компании FaceBook. React предназначен для создания одностраничных и мобильных приложений.
React Router
Это стандартная библиотека маршрутизации (routing) в React. Он хранит интерфейс приложения синхронизированным с URL на браузере. React Router позволяет вам маршрутизировать "поток данных" (data flow) в вашем приложении понятным способом.
Redux
Шаблон для JavaScript с открытым исходным кодом, предназначенный для управления состоянием приложения. Чаще всего используется в связке с React или Angular для разработки клиентской части.
Heroku
Облачная PaaS-платформа, поддерживающая ряд языков программирования. С 2010 года является дочерней компанией Salesforce.com. Heroku, одна из первых облачных платформ, появилась в июне 2007 года и изначально поддерживала только язык программирования Ruby, но на данный момент список поддерживаемых языков также включает в себя Java, Node.js, Scala, Clojure, Python, Go и PHP.

Скачайте программу курса

Чтобы вам было удобнее знакомиться с программой курса, мы создали pdf документ, в котором описали всё подробно

Ограниченное предложение

Подпишитесь на наши соцсети и получите скидку 10%
26 000 ₽
23 400 ₽
Судя по отступам, Маяковский писал на React
Бабичев Олег Николаевич Бабичев Олег Николаевич Эксперт BrainSkills,
образование: МФТИ,
компания: Сбербанк

Частые вопросы

Подходит ли для изучения онлайн-формат?
Офлайн-формат отличается высокой стоимостью и привязкой к месту проведения занятий. По современным направлениям очень трудно найти готовых индивидуально работать специалистов. Онлайн-формат позволяет нам избежать дополнительных издержек по стоимости на организацию вашего общения с экспертом. А если ваша профессия связана с технологиями и интернетом, то бояться занятий онлайн точно не стоит.
Чему можно научиться за 1,5 месяца?
За 1,5 месяца сложно стать профессионалом, но:
    - можно достаточно неплохо погрузиться в профессию
    - разобрать конкретные практические кейсы
    - узнать применяемые технологии и особенности использования современных инструментов
    - попробовать себя в деле
Frontend-разработка
26 000 ₽
23 400 ₽