continuous integration, или как мы подружили front end и back-end
TRANSCRIPT
Continuous Integration, или как мы подружили
Front-end и Back-end
Почему?
Типовой процесс разработкиПроектирование
Front-end
Back-end
Продукт
Дизайн
Типовой процесс разработкиПроектирование
Дизайн
Front-end
Back-end
Продукт
.PSD
.html .css .js
Прототип
Что в этом плохого?— Экспоненциально растущие риски— Необходимость килограммового ТЗ— Невозможность применять Agile
Типовые проблемы с “версткой”— Не все макеты— Логика ломается из-за скорости работы back-end — Верстка расползается на реальных данных
Кто виноват?Никто
— Спроектировали то что знали— Нарисовали то что спроектировали— Сверстали все макеты— Интегрировали все что было
Что делать?— Возврат к этапу с ошибкой и правят — На текущем этапе “колхозят” как умеют— Full-stack разработчик— Работать сразу над конечным продуктом, избегая промежуточных артефактов
Возврат на предыдущие этапыМинусы— Колоссальные затраты— Недоступность исполнителей
Плюсы— Можно освоить гигантские бюджеты
“Колхоз”Минусы— Требуется доп.квалификация сотрудника— Низкое качество конечного продукта
Плюсы— Дешево
Full-stack разработчикМинусы— Таких не существует— Низкое качество проектов— Высокие риски связанные с исполнителемПлюсы— Очень просто для менеджера
Отказ от артефактов — тренды
— Дизайн в браузере— Continuous Integration
“Непрерывная интеграция (CI, англ. Continuous Integration) — это практика разработки программного обеспечения, которая заключается в выполнении частых автоматизированных сборок проекта для скорейшего выявления и решения интеграционных проблем”.
© Википедия
Что значит CI для Front-end разработчика?
— Применять автоматизацию сборки— Верстать сразу на CMS/Framework
Как это внедрить в 1C-Bitrix— Применять шаблонизатор (Twig)— Готовить back-end и данные ДО front-end
Front-end CI для 1С-Bitrix — MVC
M C VМодуль Компонент Шаблон
Front-end CI для 1С-Bitrix — Шаблоны
Структура— Исходники front-end в том же .git репозитории, что и сборка Bitrix— Все “исходники” вне публичной папки— Grunt собирает assets сразу в шаблона Bitrix
Фактические изменения дляFront-end разработчика— Нужен локальный web-сервер для работы— Работа с Twig вместо HTML— Grunt/Gulp собирает сразу “внутрь” Bitrix— Тесная работа с back-end разработчиком
Что это дает?— Улучшение качества продукта— Командная работа— Уменьшение сроков разработки— Возможность гибко реагировать на изменяющиеся требования (Agile)— Continuous Deployment
Уменьшение сроков — как было
Дизайн
Интеграция+ Back-end
Front-end
Прототип
QA
Уменьшение сроков — получше
Дизайн
Front-end
Прототип
Back-end
QA
Уменьшение сроков — идеально
Дизайн
Front-end
Прототип
Back-end
QAQA
Гибкие методологии — Agile
Дизайн
Front-end
Прототип
Back-end
QAQA
x N = Agile
Так зачем нам все это?
Чтобы делатьболее крутые проектыс меньшими усилиями
Спасибо за вниманиеПодрубный Константин
email: [email protected]: http://fb.com/podrubnyweb: http://wlbl.ru/