Привет!

Меня зовут Саша Тиквач.

На прошедшем хакатоне по БЭМ я и мой коллега Антон Усманский были менторами проекта «Приборная панель».

Результатами работы нашей команды мы хотим поделиться с вами сегодня.

Как возникла идея проекта

Наша команда отвечает за поддержку шести библиотек блоков, почти в каждой из которых несколько стабильных версий — 2.x и 3.x. Как вы можете догадаться, поддерживать такое обилие библиотек непросто, поэтому очень многое у нас автоматизировано.

Когда есть возможность в реальном времени следить за состоянием библиотек (сборка, тесты, валидация стиля кода, деплой статики и документации и т.д.), работать и жить становится намного легче.

Именно поэтому мы решили разработать прототип «приборной панели», куда бы агрегировалась и выводилась информация по перечисленным выше состояниям от роботов.

Перед тем, как решить написать что-то свое, мы посмотрели на самые популярные решения в этой области, увидели их недочеты и хотели избавится от них в нашем проекте.

Прототипировать решили на наших БЭМ-технологиях.

Подготовка

Мы хотели, чтобы работа в команде протекала достаточно распределенно и прозрачно.

Для этого подготовили каркас приложения, который умел делать самые базовые вещи для доски с виджетами. Сделали небольшие заметки про процесс разработки. Подготовили инфраструктуру, а именно настроили деплой на gh-pages и интегрировали инструменты проверки code-style, чтобы не получить солянку из кода. Также набросали примерные макеты.

За основу взяли bem-core и bem-components, а также сопутствующие этим библиотекам технологии.

Постановка задачи

Наша заготовка была очень базовой, и мы понимали, что нужно работать в этом направлении тоже.

В итоге у нас выкристаллизовались две основные задачи: доработка движка и разработка виджетов.

Работа в команде и распределение задач

После презентации проекта на открытии хакатона к нам в команду записалось 3 человека: Саша Баумгертнер, Дима Белицкий и Ваня Скороходов.

Саша и Дима работают в Яндексе и на деле знают, что такое БЭМ. Ваня с БЭМом был знаком вскользь, но очень быстро во всем разобрался!

Я дорабатывал движок, помогал ребятам и делал виджет, отображающий статусы сборок веток

Антон занимался серверной частью и общими архитектурными вопросами.

Ваня взялся дорабатывать движок и делать виджет, отображающий размер свободного места на стейджинге.

Саша делал виджет про открытые PR.

Дима занялся виджетом про ревьюверов в текущем спринте.

Результаты

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

Ребята очень старались закончить все и в срок, за что им огромное спасибо!

Мы успели сделать все виджеты, а также допилить движок до состояния, умеющего их отображать.

Однако, из-за малого количества времени сделали все, к сожалению, не совсем в том качестве и виде, в котором хотели.

На хакатон мы пришли написать прототип проекта и попробовать его в деле. Эту задачу мы успешно реализовали.

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

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

Огранизация, в которой велась разработка — github.com/spbd.

Посмотреть на dashboard можно здесь.

Прототипирование — важная часть разработки, которая требует времени и сил, но в то же время помогает смотреть на вещи по-разному. Благодаря хакатону время на нее нашлось!

Ну, а мой совет вам — не ждите хакатонов, прототипируйте больше, учитесь и смотрите на проекты по-новому!

Спасибо вам огромное, и stay BEMed!