Небольшой доклад на fdconf.by про модульный фротнэнд Видео выступления: http://www.youtube.com/watch?v=3JA0MQB0t4g

1. Как (красиво)
программировать в
AngularJS то, что обычно
программируют в 1С

2. Интернет-магазин как услуга
Собственный склад
Собственный контакт-центр
Собственная бухгалтерия (с разбором отчётов)
Служба работы с клиентами-магазинами

3. Архитектурная концепция
API-first
Микросервисы
Связь через RabbitMQ
Много пользователей
Хороший UX

4. Почему AngularJS, а не 1С?
Во-первых, это круто
Умные 1С-программисты — дорогие
Масштабировать 1С можно, но плохо
1С в браузере можно, но плохо
1С — очень некрасивый

8. Что легко в 1С и сложно в AngularJS?
Таблицы и фильтрация (справочники и всё такое)
CRUD
Загрузка и выгрузка Excel
Контроль доступа
Блокировки
Промышленное оборудование

9. Как мы это делаем
Стандартные компоненты для фильтрации и таблиц
Стандартные компоненты для CRUD*
Стандартный сервис для загрузки/выгрузки Excel
Стандартный сервис аутентификации
Стандартный сервис блокировок
Творческое переосмысление работы с оборудованием
* - ещё нет

10. Распространяем через bower
Пока нет своего bower-репозитория
Собираем на teamcity, кладём в папку и раздаём по http
"dependencies": {
…
"everada-auth": "http://bower.everada.ru/ev-auth-0.1.5.zip"
}

12. Таблица (html)
<ev-ng-table
table-params="tableParams"
ev-loading="loading.load"
columns-data="tableFields">
<each-row
ng-click="editTransaction($data[$index])"/>
</ev-ng-table>

13. Таблица (контроллер)
$scope.tableFields = [
{ title: 'ID', value: 'id' },
{ title: 'Тип', value: 'type' },
(…)
{ title: 'Статус', value: 'status' },
{ title: 'Привязка', value: 'isMapped'}
];

14. Фильтры
<div ev-datepicker model="dateFilter">
</div>

15. Фильтры
<div ev-datepicker model="dateFilter">
</div>

16. Фильтры
<div
button-checkbox-group
filter-params="statusGroupConfig"
model="tableParams.filter()"
header="Статус:">
</div>

17. Фильтры
$scope.statusGroupConfig = {
buttonPrefix: 'status',
buttons:
[
{ filterValue: 'All', textValue: 'Все', isAll: true },
{ filterValue: 'Correct', textValue: 'ОК' },
{ filterValue: 'Warning', textValue: 'Требуется уточнение' },
{ filterValue: 'Error', textValue: 'Ошибка' }
]
};

19. Загрузка из Excel
1. Отправка файла на /excel/headers
2. Получение заголовков и разметка на модель
3. Отправка разметки и файла на /excel/map. Сервер возвращает json
4. Отправка json’а в API

23. Пессимистичные блокировки
Блокируем на 10 минут.
Если заблокировалось:
1. Продляем при редактировании
2. Снимаем при выходе
Если не заблокировалось:
1. Пингуем блокировку каждые 10
секунд
2. Администратор всегда может
снять

24. android + chrome
bluetooth-сканер

25. принтер этикеток
USB-сканер

26. /Как (красиво) программировать в AngularJS
то, что обычно программируют в 1С
Константин Якушев
Everada
19 апреля 2014 г.