# Хакатон по БЭМ: проект «Блоки» 


Привет! 

Меня зовут [Женя Константинов](https://ru.bem.info/authors/konstantinov-eugeny/), и я вместе с коллегой [Славой Аристовым](https://ru.bem.info/authors/aristov-slava) были менторами команды «Блоки» на первом Хакатоне по БЭМ, который прошел в ноябре 2014 года. 

Оба мы разрабатываем интерфейсы в Яндексе и занимаемся общедоступной библиотекой блоков — [bem-components](https://ru.bem.info/libs/bem-components/). Эта библиотека уже содержит множество блоков, которые вы можете использовать у себя на проектах. Однако, нам все равно мало, и мы решили написать еще! Да еще и вместе с вами на нашем Хакатоне по БЭМ. 

Благодаря вам у нас все получилось. Как — читайте дальше!

![](https://img-fotki.yandex.ru/get/15548/44214498.bd/0_9bc10_1d0ecdbf_XL.jpg)

## Техническое задание на Хакатон

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

Однако, мы понимали, что придумать все возможные блоки можно только вместе. Поэтому в ответ спросили и разработчиков. 

В итоге у нас получился такой список блоков: 
  * calendar, 
  * datepicker, 
  * carousel, 
  * lightbox, 
  * cut, 
  * map, 
  * tabs, 
  * progressbar
  * и dragndrop. 

Мы старались подобрать блоки разной сложности реализации, чтобы каждый смог взять себе блок еще и «по силам».

После короткой презентации проектов в самом начале, на которую у нас ушло около 10 минут, наша команда была практически сформирована, и к тому же многочисленна, если сравнить с соседними командами. 

В нее вошли эти смелые ребята и двое нас — менторов.

![](https://img-fotki.yandex.ru/get/6832/127846884.248/0_1195cf_76163a5b_XL.jpg)

## Организация работы в команде

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

Сначала мы вместе обсудили АПИ каждого блока, затем закрепили блоки за членами нашей команды, сходили на обед (на голодный желудок работать нельзя!) и приступили к разработке. 

Нашей целью было не только написать блоки, но и покрыть их тестами (для каждого блока в bem-components написаны unit-тесты, тесты на шаблоны и gemini-тесты). Исходя из таких требований нас к нам самим же и к нашей работе, времени у нас было совсем мало. 

Нельзя было тратить ни минуты! Мы писали код, обсуждали сложные моменты, перемещали стикеры с состоянием нашего разработческого прогресса по импровизированной канбан-доске от статуса «разработка» до статуса «ревью кода». 

![](https://img-fotki.yandex.ru/get/15528/44214498.bd/0_9bc16_5f473ed1_XL.jpg)

## Финальная стадия 

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

Результаты нашей работы мы оформили в виде единой страницы, где разместили все блоки, которые были сделаны: 
  * map, 
  * cut, 
  * calendar, 
  * tabs, 
  * progressbar, 
  * dragndrop. 

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

Теперь нам нужно было рассказать о том, что мы сделали за два дня, всем участникам Хакатона. Вместе с командой мы собрали презентацию проекта, и в ходе нее каждый рассказал о проделанной им работе, сложностях и памятных моментах, опыте, который вынес. Это было отличное испытание во всех смыслах этого слова!

![](https://img-fotki.yandex.ru/get/15560/44214498.bd/0_9bc17_bd8b4c0c_XL.jpg)

## Итоги

По результатам Хакатона наша **команда написала 6 новых блоков** и частично покрыла их код тестами и документацией. Рабочий репозиторий можно посмотреть по [ссылке](https://github.com/sipayRT/hackaton). 

После Хакатона мы продолжили приводить код блоков в надлежащий вид, после чего **влили блок progressbar** в библиотеку блоков [bem-components](https://ru.bem.info/libs/bem-components/v2.0.0/desktop/progressbar/). Теперь им могут пользоваться все!

Мы также завели **отдельную организацию** [bem-incubator](https://github.com/bem-incubator/), где собираемся вести совместную разработку проектов вместе с нашим сообществом БЭМ. Присоединяйтесь!

Подводя итоги, я, как ментор, могу сказать, что главной ценностью в этом мероприятии была командная работа ребят и вынесенный опыт для каждого члена команды. Каждый унес с собой горсть знаний — у кого-то эта горсть была большая, у кого-то поменьше. Но в обиде никто не остался ;)

Ну и конечно же, хочется отдельно поблагодарить организаторов Хакатона за то, что создали для нас такие условия, что мы смогли полностью погрузиться в работу на эти 2 дня.

Мы были полностью и безоговорочно **BEMed** :) Надеемся, что все продолжат в том же духе!

**Stay BEMed!**

**P.S.** И за день рождения с подарком от всех тоже спасибо! Не ожидал!

![](https://img-fotki.yandex.ru/get/15574/44214498.bd/0_9bc03_545c69fb_XL.jpg)