1. Новый взгляд на старые проблемы
MoscowJS 18
29 января 2015 г.
Сергей Прохоров
1

2. В активном поиске…
2

3. AngularJS, Ember.js,..
Внутри все есть!
3

4. ● Сложные решения
● Порог вхождения
● Ограничения
● Нужно уметь готовить
На выходе
4

5. Боль…
5

6. Ok. Backbone.js
Свобода!

7. Выбираем архитектуру
А можно всех посмотреть?

8. MV*
● MVC
● MVP
● MV[‘Здесь могла быть ваша реклама’]
8

9. Нужно больше боли!
9

10. Controller
Controller
Model View
Model View
View
/MV*./ instanceof 42
10

11. 11

12. Блок-схема Flux
12

13. Задачи React View
● Отображение данных
● Обработка польз. действий
13

14. React View
… Купить …
14

15. React View
… Купить …
15

16. React View
… Купить …
16

17. Блок-схема Flux
17

18. Задачи Action Creator
● Передача данных в Dispatcher
● Запросы к API
18

19. Action Creator
19

20. Action Creator
20

21. Action Creator
21

22. Блок-схема Flux
22

23. Задачи Dispatcher
● Передача данных в Store
23

24. Dispatcher
24

25. Dispatcher
25

26. Dispatcher
26

27. Блок-схема Flux
27

28. Задачи Store
28
● Информировать представления
● Хранить состояние

29. Store
29

30. Store
30

31. Store
31

32. Store
32

33. Store
33

34. Синхронная работа Store
34

35. ● Однонаправленный поток данных
Unidirectional data flow
● Независимые хранилища данных
Independent stores
● Отсутствие каскадных обновлений
No cascading actions
● Возможность синхронной обработки данных
Synchronous stores
Отличительные особенности
35

36. ● Простота и предсказуемость
● Мало магии
● Линейное масштабирование
● Небольшое количество абстракций
● Boilerplate
Profit?
36

37. В зоопарке
37
● McFly — github.com/kenwheeler/mcfly
● Reflux — github.com/spoike/refluxjs
● Alt — github.com/goatslacker/alt
● Delorean — deloreanjs.com
● Marty.js — martyjs.org
● Fluxxor — fluxxor.com
● …

38. Ссылки
Flux — facebook.github.io/flux
Github — github.com/facebook/flux
38

39. Вопросы?
Сергей Прохоров
github.com/proxyfabio
facebook.com/proxyfabio
39