Разработка пользовательских интерфейсов с использованием React JS
JS_React
React — JavaScript-библиотека с открытым исходным кодом для разработки пользовательских интерфейсов. React разрабатывается, и поддерживается Facebook. React используется для разработки одностраничных и мобильных приложений. Его цель — предоставить высокую скорость, простоту, и масштабируемость Web-приложений. В качестве библиотеки для разработки пользовательских интерфейсов, React часто используется с Redux. Двумя основными конкурентами React являются Vue и Angular. Вместе с ними React закрывает почти 100% рынка Web-разработки.
Аудитория
Разработчики, знающие Javascript/ES-6
Необходимый уровень подготовки
Знание Javascript/ES-6
Результат обучения
После завершения курса, слушатели самостоятельно смогут создавать клиентские приложения на основе каркаса React/Redux. Все примеры передаются слушателям.
Программа курса
1. Введение.
- Cравнение js-фреймворков: Angular, React, Vue
- Введение в React
- Общее устройство React (компоненты, Virtual Dom, JSX)
- Установка React
- Сборка веб-приложения
- Первое приложение на React
2. Компоненты, JSX и рендеринг.
- потоки данных
- устройство компонентов
- жизненный цикл
- JSX
- рендеринг элементов
- Conditional Rendering
3. События, формы, внешние API.
- Обработка событий на React
- Работа с формой
- Получение данных от внешнего API с помощью AJAX
4. Навигация и маршрутизация.
- SPA-application на React
- способы организации роутинга
- работаем с history
5. Использование Redux.
- Зачем нужен Redux, какую основную проблему он решает.
- Особенности Redux.js: функциональный подход, Redux dev tools, возможности для мониторинга и универсальных приложений.
- Store как иммутабельный объект: Redux + Immutable.js.
- Настраиваем синхронный поток с Redux, переиспользуем созданные ранее компоненты.
- React-redux для связи компонентов с логикой.
- Мемоизированные селекторы reselect.
- Side-effects в Redux: создание и использование Middlewares.
- Получение данных от сервера.
- Асинхронные экшены с redux-thunk
6. Упрощение работы, отладка, закрепление знаний.
- Chrome devtools for React
- Работа и отладка в Webstorm
- Работа и отладка в VS Code