Курс
React.js разработчик

На этом курсе вы отточите свои навыки React, практикуясь в JSX, создавая и визуализируя компоненты, передавая реквизиты, а также просматривая данные и многое другое.

Записаться
JS

JAVASCRIPT

курс программирования

Что входит в программу курса

React - это библиотека JavaScript для создания пользовательских интерфейсов. React ускоряет и упрощает создание и поддержку пользовательского интерфейса вашего приложения, разбивая его на более мелкие, повторно используемые компоненты.

Работа в Adobe Photoshop

На первом этапе курса вы освоите все необходимые для программирования инструменты Photoshop.

Получить консультацию

Верстка сайтов из PSD макета.

Вы научитесь создавать сайты, адаптированные под мобильные устройства.

Получить консультацию

Разработка front-end части интернет-магазина на JavaScript

На этом этапе курса у студентов есть возможность выполнять коммерческие проекты.

Получить консультацию

Разработка веб-приложения на React.js

На заключительном этапе курса, вы освоите все необходимые навыки для работы. К этому времени ввашем портфолио будет 8 учебных и 1 коммерческий проект.

Получить консультацию

Программа курса

Во время курса вы будете работать как настоящие верстальщики: поработаете с системой контроля версий в GitHub Desktop и с графическим макетом в редакторе
Курс React.js разработчик

ДЛИТЕЛЬНОСТЬ: 2.5 месяца
Кол-во занятий : 12

React - это библиотека JavaScript, разработанная на Facebook для создания пользовательских интерфейсов. React позволяет вам описать, как ваше приложение должно отображаться в доступной для понимания форме. Это также помогает устранить сложности, возникающие при обновлении элементов DOM, когда пользователи взаимодействуют с вашим приложением. React изменит ваше представление о создании веб-приложений!

Введение в React.

React.js -- одна из самых популярных библиотек для создания современных Frontend-приложений. На первом занятии модуля React.js мы ознакомимся с компонентным подходом, позволяющим создавать сложные интерфейсы.

Цель занятия:

Узнать, какие проблемы решает библиотека React.js. Понять, как мы можем упростить наш проект с помощью React.js.

Темы занятия:

·       Что такое React.зачем его использовать.

·       Пишем первое React приложение.

·       Как устроен современный JS. Вспоминаем ES6+.

·       Описание первого проекта. Create-react-app.

Основы React.

Компоненты являются основными строительными блоками приложения React. Это занятие повысит уровень ваших навыков React, предоставив лучшее представление о классовых и функциональных компонентах, методах состояния и жизненного цикла, а также о том, как разбить ваш пользовательский интерфейс на повторно используемые и компонуемые компоненты.

Цель занятия:

Разобраться с тем, как создавать компоненты на React.js. Разобрать ряд подводных камней, на которые часто наступают начинающие React-разработчики.

Темы занятия:

·       React элементы.

·       React компоненты.

·       JSX.

·       Структурасовременных react приложений.

·       Props.

·       Массивыв качестве props. Ключи.

·       Работа с css.

Компоненты React.

Улучшим знания о React и компонентах. Разберём state, события и методы жизненного цикла компонента.

Цель занятия:

Важно тщательно продумать, где находится состояние в вашем приложении. На этом этапе вы будете реструктурировать состояние и поток данных, чтобы сделать их более однонаправленными.

Темы занятия:

·       Компоненты классы (statefull components).

·       State – состояние компонента.

·       Работа с событиями.

·       Изменение state.

·       Условный рендеринг.

·       Собственные события.

·       Работа с формами.

·       Контролируемые компоненты.

Работа с сервером.

На этом занятии мы разберем способы работы с сервером в JS. Рассмотрим концепцию и использования интерфейса для извлечения ресурсов (в том числе по сети).

Цель занятия:

Изучить различные методы извлечения внешних данных в React и способы отображения данных в вашем приложении. Научитесь использовать Fetch API, интерфейс извлечения данных, встроенный в браузер, для загрузки внешних данных и обновления состояния в React.

Темы занятия:

·       Способы работы с сервером в js.

·       Postman.

·       Fetch API.

·       Создание клиента для API.

·       Обработка ошибок.

·       Трансформация данных API.

·       Создаём индикатор загрузки.

·       Обработка ошибок сети в компоненте.

·       Выводы.

Жизненный цикл компонентов. Паттерны React.

Это занятие охватывает работу с методами жизненного цикла компонентов React. Вы также научитесь использовать условный рендеринг для обновления вашего интерфейса на основе текущего состояния.

Цель занятия:

Понять принципы работы проектирования, обновления состояния, сброс состояния приложения  React.

Темы занятия:

·       Для чего нужен жизненный цикл.

·       Методы жизненного цикла.

·       Использование функций. Render-функции.

Паттерны React.

На этом уроке вы изучите полезные шаблоны проектирования для использования в ваших компонентах React. Эти шаблоны не только помогут вам избежать написания беспорядочного и слишком сложного кода, но также помогут вам создать гибкие, более производительные компоненты, которые легче понять и поддерживать.

Цель занятия:

Изучить компоненты высшего порядка в React. Понять принцип работы полезных паттернов React.

Темы занятия:

·       Свойства-элементы.Children.

·       React.Children, React.cloneElements.

·       Компоненты высшего порядка(HOC). Композиция HOC.

React router.

Научитесь использовать React Router, декларативное решение для маршрутизации для React, для управления навигацией и рендерингом компонентов в ваших приложениях.

React предоставляет способ передачи данных компонентам без необходимости вручную передавать реквизиты на каждом уровне или использовать библиотеку управления состояниями, такую ​​как Redux. На этом занятии мы так же разберем тему  React Сontext API.

Цель занятия:

Изучить основы маршрутизации и преимущества простого декларативного подхода React Router к написанию маршрутов.

Темы занятия:

·       Валидация props.

·       React Сontext API.

·       Роутинг в SPA.

·       Основы React-router (Link, Route, withRouter, Switch).

React hooks.

Паттерн Hook предоставляет альтернативу написанию компонентов на основе классов и простое в использовании состояние и имеет альтернативу для методов жизненного цикла. Hooks привносят в функциональные компоненты то, что мы когда-то могли делать только с классами, например, возможность работать с локальным состоянием React , эффектами и контекстом через useState, useEffectи useContext.

Цель занятия:

Научиться использовать на практике React Hooks.

Темы занятия:

·       Что такое reacthooks.

·       Основное хуки.

·       Загрузка данных с помощью react hooks.

·       Правила и ограничения хуков,

Хранение данных. Redux.

Redux позволяет легко управлять состоянием вашего приложения. Еще один способ взглянуть на это - он помогает вам управлять отображаемыми данными и тем, как вы реагируете на действия пользователя.

Цель занятия:

Познакомиться с Flux-архитектурой: диспетчеры, действия, представления и хранилища. Подключить к проекту Redux и обновить кодовую базу.

Темы занятия:

·       Проблема property drill в React.

·       Основы flux архитектуры. Redux.

·       Store, State, reducers,actions. Pure functions.

·       Используем redux в react.

Ассинхронность в Redux.

На этом занятии вы глубже погрузитесь в магию Redux. Разберем принципы работы библиотеки, которая позволяет вам возвращать функцию, вместо объекта, вызывая action creator.

Цель занятия:

Поймем, как внедрять асинхронный код в синхронную работу Redux.

Темы занятия:

·       Компоненты контейнеры.

·       Store enhancers.

·       MapStateToProps, MapDispatchToProps.

·       Ассинхронность в Redux. Middleware.

·       Thunk.

Тестирование React.

Это занятие посвящено стратегиям тестирования для React-приложений.

Цель занятия:

Создадим тесты для компонентов React, настроим инфраструктуру для тестирования React-приложений. Понять принципы работы Jest - это JavaScript-тестер, который позволяет вам получить доступ к DOM черезjsdom.

Темы занятия:

·       Jest.

·       Enzyme.

·       PropTypes.

Знакомство с обновлениями React.

Узнайте больше о новых функциях в React 16, полной переписке библиотеки React

Цель занятия:

Изучить новую базовую архитектуру React 16 под кодовым названием «Fiber», которая сохраняет большую часть API-интерфейса без изменений и обратно совместима.

Темы занятия:

·       Fiber

Разработка выпускного проекта

Во время разработки проекта у вас будет 4 консультации с преподавателем (1 раз в неделю).

Как пишется проект?

Начало разработки проекта. (1 неделя)

Первая оценка проекта преподавателем. (2 неделя)

Улучшение проекта по замечаниям преподавателя и подача на вторую оценку. (3 неделя)

Внесение финальных правок и получение итоговой оценки. (4 неделя)

Защита итогового проекта:

Для оценки проекта, вам будет необходимо развернуть сборку приложения React на сервере Github.

Проект  оценивается по 10-ти балльной шкале. От вашей оценки проекта зависит ваше трудоустройство.

Записаться

Наши студенты
работают в ведущих компаниях СНГ

03 / Актуальные профессии

Наши студенты
работают в ведущих компаниях РБ.

#ormedia_career

Каждый ученик получает поддержку от Центра развития карьеры.

Помощь в подготовке резюме и прохождении собеседования

Консультация с HR-специалистом по поиску работы и развитию вашей карьеры

Возможность прохождения стажировки на наших собственных проектах.

Организация и проведение преддипломной практики для студентов ВУЗов.

Перейти
Testimonial Image

Наша программа обучения составлена таким образом, что с 6-ой недели обучения мы даем возможность нашим ученикам выполнять тестовые задания от наших заказчиков.

Каждый выпускник получает 2 сертификата (online,а также в виде документа). Это не просто “корочка”, которую можно показать друзьям, а реальное доказательство ваших знаний.

Поможем в выборе

Если у вас остались вопросы о формате или вы не знаете, что выбрать.
Ohhh Yes!!

Your submission has been staged.
We'll check it out and submit it within 24 hours.
This is some text inside of a div block.
Oops! Something went wrong while submitting the form.