React – JS-библиотека для создания пользовательских интерфейсов Web

React — JavaScript-библиотека с открытым исходным кодом для разработки пользовательских интерфейсов. React разрабатывается, и поддерживается Facebook. React используется для разработки одностраничных и мобильных приложений. Его цель — предоставить высокую скорость, простоту, и масштабируемость Web-приложений. В качестве библиотеки для разработки пользовательских интерфейсов, React часто используется с Redux. Двумя основными конкурентами React являются Vue и Angular. Вместе с ними React закрывает почти 100% рынка Web-разработки.

  Для кого:

Разработчики, знающие Javascript/ES-6

Что должен знать слушатель

  • Javascript/ES-6

Результаты обучения

После завершения курса, слушатели самостоятельно смогут создавать клиентские приложения на основе каркаса React/Redux. Все примеры передаются слушателям. Устанавливать интерпретатор Python

Необходимая подготовка:

  • Javascript/ES-6

Программа обучения

Модуль 1 Введение ▼

  • 1.1 Cравнение js-фреи?мворков: Angular, React, Vue
  • 1.2 Введение в React
  • 1.3 Общее устройство React (компоненты, Virtual Dom, JSX)
  • 1.4 Установка React
  • 1.5 Сборка веб-приложения
  • 1.6 Первое приложение на React

Модуль 2 Компоненты, JSX и рендеринг ▼

  • 2.1 Потоки данных
  • 2.2 Устройство компонентов
  • 2.3 Жизненный цикл
  • 2.4 JSX
  • 2.5 Рендеринг элементов
  • 2.6 Conditional Rendering

Модуль 3 События, формы, внешние API ▼

  • 3.1 Обработка событий на React
  • 3.2 Работа с формой
  • 3.3 Получение данных от внешнего API с помощью AJAX

Модуль 4 Навигация и маршрутизация ▼

  • 4.1 SPA-application на React
  • 4.2 Способы организации роутинга
  • 4.3 Работаем с history
  • 4.4 Элементы функционального программирования.

Модуль 5 Использование Redux ▼

  • 5.1 Зачем нужен Redux, какую основную проблему он решает.
  • 5.2 Особенности Redux.js: функциональный подход, Redux dev tools, возможности для мониторинга и универсальных приложений.
  • 5.3 Store как иммутабельный объект: Redux + Immutable.js.
  • 5.4 Настраиваем синхронный поток с Redux, переиспользуем созданные ранее компоненты.
  • 5.5 React-redux для связи компонентов с логикой.
  • 5.6 Мемоизированные селекторы reselect.
  • 5.7 Side-effects в Redux: создание и использование Middlewares.
  • 5.8 Получение данных от сервера.
  • 5.9 Асинхронные экшены с redux-thunk

Модуль 6 Упрощение работы, отладка, закрепление знаний ▼

  • 6.1 Chrome devtools for React
  • 6.2 Работа и отладка в Webstorm
  • 6.3 Работа и отладка в VS Code