Скачать презентацию Java Script головного мозга История одного фреймворка Зуев Скачать презентацию Java Script головного мозга История одного фреймворка Зуев

6_Зуев.pptx

  • Количество слайдов: 72

Java. Script головного мозга. История одного фреймворка Зуев Дмитрий / Ведущий инженер-программист Java. Script головного мозга. История одного фреймворка Зуев Дмитрий / Ведущий инженер-программист

СБИС – сеть деловых коммуникаций более миллиона клиентов 10 центров разработки более 1000 программистов СБИС – сеть деловых коммуникаций более миллиона клиентов 10 центров разработки более 1000 программистов 2

online. sbis. ru 3 online. sbis. ru 3

online. sbis. ru 4 online. sbis. ru 4

online. sbis. ru 5 online. sbis. ru 5

online. sbis. ru 6 online. sbis. ru 6

online. sbis. ru 7 online. sbis. ru 7

online. sbis. ru 8 online. sbis. ru 8

online. sbis. ru 9 online. sbis. ru 9

Разделение ответственности Разделение ответственности

Глобальная компонентизация Глобальная компонентизация

Макет карточки аккаунта в биллинге (2012 год) 12 Макет карточки аккаунта в биллинге (2012 год) 12

Макет. Апрель 2017 13 Макет. Апрель 2017 13

Макет. Наши дни 14 Макет. Наши дни 14

Спецификация 15 Спецификация 15

Разделяй и властвуй 16 Разделяй и властвуй 16

Как 2 капли 17 Как 2 капли 17

Но такие разные 18 Но такие разные 18

Мы строим интерфейс из кубиков 19 Мы строим интерфейс из кубиков 19

Нужны контракты 20 Нужны контракты 20

Модно? Молодежно? Хайпово? 21 Модно? Молодежно? Хайпово? 21

Модно? Молодежно? Хайпово? 22 Модно? Молодежно? Хайпово? 22

Модно? Молодежно? Хайпово? 23 Модно? Молодежно? Хайпово? 23

Модно? Молодежно? Хайпово? 24 Модно? Молодежно? Хайпово? 24

Никто не знает как собирать приложения 25 Никто не знает как собирать приложения 25

Как сделать веб-приложение из 5000 окон и 1000 программистов? 26 Как сделать веб-приложение из 5000 окон и 1000 программистов? 26

No comment… 27 No comment… 27

Первые контролы 28 Первые контролы 28

10 отличий? 29 10 отличий? 29

Последствия 30 Последствия 30

Последствия 31 Последствия 31

Последствия 32 Последствия 32

Server render 33 Server render 33

Корень зла! 34 Корень зла! 34

Светлое сегодня 35 Светлое сегодня 35

Все гениальное – просто (с) 36 Все гениальное – просто (с) 36

Аспекты 37 Аспекты 37

10 отличий? 38 10 отличий? 38

Аспекты 39 Аспекты 39

Аспекты 40 Аспекты 40

Время интерфейсов и абстракций 41 Время интерфейсов и абстракций 41

Время интерфейсов и абстракций 42 Время интерфейсов и абстракций 42

Tree. Grid 43 Tree. Grid 43

Tree. Grid HTML 44 Tree. Grid HTML 44

Tree. Grid User data HTML 45 Tree. Grid User data HTML 45

Tree. Grid User data ? ? ? HTML 46 Tree. Grid User data ? ? ? HTML 46

Controller работа с источником данных Удаление, добавление, редактирование записей по месту 47 Controller работа с источником данных Удаление, добавление, редактирование записей по месту 47

Controller настройка порядка колонок работа с источником данных: Удаление, добавление, редактирование записей по месту Controller настройка порядка колонок работа с источником данных: Удаление, добавление, редактирование записей по месту 48

Controller раскрытие узлов иерархии работа с источником данных: удаление, добавление, редактирование записей по месту; Controller раскрытие узлов иерархии работа с источником данных: удаление, добавление, редактирование записей по месту; настройка порядка колонок 49

Controller бесконечная загрузка по скроллу работа с источником данных: удаление, добавление, редактирование записей по Controller бесконечная загрузка по скроллу работа с источником данных: удаление, добавление, редактирование записей по месту; настройка порядка колонок; раскрытие узлов иерархии; 50

Controller работа с выделением работа с источником данных: удаление, добавление, редактирование записей по месту; Controller работа с выделением работа с источником данных: удаление, добавление, редактирование записей по месту; настройка порядка колонок; раскрытие узлов иерархии; бесконечная загрузка по скроллу; 51

Controller drag&drop работа с источником данных: удаление, добавление, редактирование записей по месту; настройка порядка Controller drag&drop работа с источником данных: удаление, добавление, редактирование записей по месту; настройка порядка колонок; раскрытие узлов иерархии; бесконечная загрузка по скроллу; работа с выделением 52

Controller поддержка swipe работа с источником данных: удаление, добавление, редактирование записей по месту; настройка Controller поддержка swipe работа с источником данных: удаление, добавление, редактирование записей по месту; настройка порядка колонок; раскрытие узлов иерархии; бесконечная загрузка по скроллу; работа с выделением; drag&drop; 53

Controller группировка работа с источником данных: удаление, добавление, редактирование записей по месту; настройка порядка Controller группировка работа с источником данных: удаление, добавление, редактирование записей по месту; настройка порядка колонок; раскрытие узлов иерархии; бесконечная загрузка по скроллу; работа с выделением; drag&drop; поддержка swipe; 54

Controller выгрузка, печать работа с источником данных: удаление, добавление, редактирование записей по месту; настройка Controller выгрузка, печать работа с источником данных: удаление, добавление, редактирование записей по месту; настройка порядка колонок; раскрытие узлов иерархии; бесконечная загрузка по скроллу; работа с выделением; drag&drop; поддержка swipe; группировка; 55

Это контроллер? ! 56 Это контроллер? ! 56

Делай солидно! 57 Делай солидно! 57

Автотесты 58 Автотесты 58

Оно всегда работает! 59 Оно всегда работает! 59

Агрегация+композиция 60 Агрегация+композиция 60

Пример разметки 61 Пример разметки 61

Базовые раскладки 62 Базовые раскладки 62

Сотни реестров 63 Сотни реестров 63

Сотни документов 64 Сотни документов 64

Посмотрим в код Master. Detail 65 Посмотрим в код Master. Detail 65

А теперь код того, кто использует 66 А теперь код того, кто использует 66

А теперь код того, кто использует 67 А теперь код того, кто использует 67

Single Page Application 68 Single Page Application 68

Render на сервере Render на клиенте Изоморфный код 69 Render на сервере Render на клиенте Изоморфный код 69

И получили мы изоморфность интерфейсоориентированность SOLIDность 70 И получили мы изоморфность интерфейсоориентированность SOLIDность 70

71 71

Спасибо за внимание! Зуев Дмитрий e-mail: dv. zuev@tensor. ru sbis. ru Спасибо за внимание! Зуев Дмитрий e-mail: dv. zuev@tensor. ru sbis. ru