РАЗРАБОТКА ИЗОМОРФНЫХ SPA НА REACT

 
Стоимость видеозаписи
Мастер-класс завершен. Вы можете купить его запись
Покупая онлайн-трансляцию, вы получаете полноценное участие в ивенте не выходя из дому. Это звук, видео и возможность задавать вопросы. Это не видеозапись, но 100% эффект присутствия.
Время проведения
13
сентября2015
Завершено

09:00 - 18:00

офис Cogniance по адресу г. Киев, ул. Боженко, 86-О (Google Maps)

Описание

Приложения в формате Single Page Application постепенно захватывают мир. Единственное, что сдерживает их от окончательного уничтожения привычного нам WEB - это высшая сложность разработки и недостатки отсутствия серверного рендера. Для нас, как для разработчиков, первая проблема - вообще не проблема, это челлендж. А вот о втором мы с вами поговорим подробно и научимся решать на мастер-классе. Вы узнаете, как современные инструменты помогают не просто справиться с этой задачей, но и писать вдвое меньше клиентского кода и разрабатывать UI "на лету".

На мастер-классе мы научимся использовать новейшие инструменты для работы с React, такие как Redux.js и ES6. Мы не просто разберемся с традиционной для React-приложений архитектурой Flux, мы попобачимо как она развивалась, которое у нее будущее, и мы можем получить сейчас. Вы увидите, как строить приложения, используя hot-reload, как легко настроить серверный рендеринг и значительно упростить решение рутинных задач.

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

Pre-Requirements:
- Базовое знание React.js
- Знакомство с особенностями ES6 желательно, но не обязательно

План мероприятия

1. Введение, знакомство с инструментами:

  • формулируем задачу
  • Webpack
  • ES 6
  • Material UI

2. Обзор Flux:

  • Unidirectional data flow
  • Actions, Dispatcher, Stores
  • Строим фундамент системы

3. React Router:

  • Основы SPA, роутинг
  • Обзор React Router, его возможности
  • Добавляем роутинг к проекту

4. Redux:

  • Hot reloading! - Строим проект забыв о перезагрузке
  • Проблемы Flux в изоморфных приложениях, разрушаем фундамент
  • Основы Redux, чем отличается от Flux, как мигрировать
  • Поговорим о функциональное программирование, или Stores и Action creators как чистые функции

5. Делаем приложение изоморфным:

  • Перенесем роутинг на клиент, React Router HistoryLocation
  • Настраиваем рендеринг на сервер