БЭМ в Мануфактуре РИФ-Воронеж 2014

МАНУФАКТУРАИнтерактивное агентство

♥

МАНУФАКТУРАИнтерактивное агентство

♥

Как мы жили до БЭМа и к чему пришли с ним • Воищев Иван • Factory.mn

МАНУФАКТУРАИнтерактивное агентство

Как мы жили до БЭМа и к чему пришли с ним

2 / 60

РИФ-Воронеж, 3 октября 2014

ОБО МНЕ

Как мы жили до БЭМа и к чему пришли с ним • Воищев Иван • Factory.mn 3 / 60

В «Мануфактуре» 3 года

Ведущий Front-end разработчик

Воищев Иван

@voischev

Как мы жили до БЭМа и к чему пришли с ним • Воищев Иван • Factory.mn 4 / 60

СОДЕРЖАНИЕПроблемы4

• Старый подход

Решение4

• Собственные инструменты

• BEM full stack (Сервис Myweddy.ru)

Профит4

• Воркфлоу

• Cобственные библиотеки блоков

• О команде

Как мы жили до БЭМа и к чему пришли с ним • Воищев Иван • Factory.mn 4 / 60

СОДЕРЖАНИЕПроблемы4

• Старый подход

Решение4

• Собственные инструменты

• BEM full stack (Сервис Myweddy.ru)

Профит4

• Воркфлоу

• Cобственные библиотеки блоков

• О команде

2011

20122013

Cейчас

Как мы жили до БЭМа и к чему пришли с ним • Воищев Иван • Factory.mn 4 / 60

СОДЕРЖАНИЕПроблемы4

• Старый подход

Решение4

• Собственные инструменты

• BEM full stack (Сервис Myweddy.ru)

Профит4

• Воркфлоу

• Cобственные библиотеки блоков

• О команде

2011

20122013

Cейчас

Как мы жили до БЭМа и к чему пришли с ним • Воищев Иван • Factory.mn 4 / 60

СОДЕРЖАНИЕПроблемы4

• Старый подход

Решение4

• Собственные инструменты

• BEM full stack (Сервис Myweddy.ru)

Профит4

• Воркфлоу

• Cобственные библиотеки блоков

• О команде

2011

20122013

Cейчас

5 / 60

ПРОБЛЕМЫ 2011 год

Как мы жили до БЭМа и к чему пришли с ним • Воищев Иван • Factory.mn

5 / 60

ПРОБЛЕМЫ

• HTML – это хаос!

2011 год

Как мы жили до БЭМа и к чему пришли с ним • Воищев Иван • Factory.mn

5 / 60

ПРОБЛЕМЫ

• Большие CSS файлы• HTML – это хаос!

2011 год

Как мы жили до БЭМа и к чему пришли с ним • Воищев Иван • Factory.mn

5 / 60

ПРОБЛЕМЫ

• Большие CSS файлы• HTML – это хаос!

• JS где-то сбоку

2011 год

Как мы жили до БЭМа и к чему пришли с ним • Воищев Иван • Factory.mn

5 / 60

ПРОБЛЕМЫ

• Большие CSS файлы• HTML – это хаос!

• JS где-то сбоку

2011 год

• Нет общего языка общения в команде

Как мы жили до БЭМа и к чему пришли с ним • Воищев Иван • Factory.mn

5 / 60

ПРОБЛЕМЫ

• Большие CSS файлы• HTML – это хаос!

• JS где-то сбоку

2011 год

• Нет общего языка общения в команде• Быстро развивающаяся индустрия

Как мы жили до БЭМа и к чему пришли с ним • Воищев Иван • Factory.mn

5 / 60

ПРОБЛЕМЫ

• Большие CSS файлы• HTML – это хаос!

• JS где-то сбоку

2011 год

• Нет общего языка общения в команде• Быстро развивающаяся индустрия

Как мы жили до БЭМа и к чему пришли с ним • Воищев Иван • Factory.mn

• Низкая скорость разработки

6 / 60

Проблемы

6 / 60

Проблемы

6 / 60

Проблемы

7 / 60

Проблемы

7 / 60

Проблемы

7 / 60

Проблемы

8 / 60Как мы жили до БЭМа и к чему пришли с ним • Воищев Иван • Factory.mn

9 / 60

РЕШЕНИЕ 2012 год

Как мы жили до БЭМа и к чему пришли с ним • Воищев Иван • Factory.mn

9 / 60

РЕШЕНИЕ 2012 год

• Выбрать методологию разработки

Как мы жили до БЭМа и к чему пришли с ним • Воищев Иван • Factory.mn

9 / 60

РЕШЕНИЕ 2012 год

• Выбрать методологию разработки• Инструменты сборки

Как мы жили до БЭМа и к чему пришли с ним • Воищев Иван • Factory.mn

10 / 60Как мы жили до БЭМа и к чему пришли с ним • Воищев Иван • Factory.mn

11 / 60Как мы жили до БЭМа и к чему пришли с ним • Воищев Иван • Factory.mn

Сходство

13 / 60Как мы жили до БЭМа и к чему пришли с ним • Воищев Иван • Factory.mn

Независимость

14 / 60Как мы жили до БЭМа и к чему пришли с ним • Воищев Иван • Factory.mn

15/ 60

ЗАДАЧИ ПЕРЕД ИНСТРУМЕНТОМ СБОРКИ ПРОЕКТОВ 2012 год

Как мы жили до БЭМа и к чему пришли с ним • Воищев Иван • Factory.mn

15/ 60

ЗАДАЧИ ПЕРЕД ИНСТРУМЕНТОМ СБОРКИ ПРОЕКТОВ 2012 год

• Все технологии блока в одном месте

Как мы жили до БЭМа и к чему пришли с ним • Воищев Иван • Factory.mn

15/ 60

ЗАДАЧИ ПЕРЕД ИНСТРУМЕНТОМ СБОРКИ ПРОЕКТОВ 2012 год

• Все технологии блока в одном месте• Простая модификация кода

Как мы жили до БЭМа и к чему пришли с ним • Воищев Иван • Factory.mn

15/ 60

ЗАДАЧИ ПЕРЕД ИНСТРУМЕНТОМ СБОРКИ ПРОЕКТОВ 2012 год

• Все технологии блока в одном месте• Простая модификация кода• Полное разделение ответственности разработчиков

Как мы жили до БЭМа и к чему пришли с ним • Воищев Иван • Factory.mn

15/ 60

ЗАДАЧИ ПЕРЕД ИНСТРУМЕНТОМ СБОРКИ ПРОЕКТОВ 2012 год

• Все технологии блока в одном месте• Простая модификация кода• Полное разделение ответственности разработчиков• Автоматическая подготовка кода к продакшену

Как мы жили до БЭМа и к чему пришли с ним • Воищев Иван • Factory.mn

15/ 60

ЗАДАЧИ ПЕРЕД ИНСТРУМЕНТОМ СБОРКИ ПРОЕКТОВ 2012 год

• Все технологии блока в одном месте• Простая модификация кода• Полное разделение ответственности разработчиков• Автоматическая подготовка кода к продакшену• Удобный деплой проектов

Как мы жили до БЭМа и к чему пришли с ним • Воищев Иван • Factory.mn

16 / 60Как мы жили до БЭМа и к чему пришли с ним • Воищев Иван • Factory.mn

Первый взгляд на bem-tools в 2012

8 / 94Как мы жили до БЭМа и к чему пришли с ним • Воищев Иван • Factory.mn

Первый взгляд на bem-tools в 2012

17 / 60

8 / 94Как мы жили до БЭМа и к чему пришли с ним • Воищев Иван • Factory.mn

Первый взгляд на bem-tools в 2012

• Не хватало технологий для связи с бэкендом

17 / 60

8 / 94Как мы жили до БЭМа и к чему пришли с ним • Воищев Иван • Factory.mn

Первый взгляд на bem-tools в 2012

• Не хватало технологий для связи с бэкендом

• Мало документации

17 / 60

8 / 94Как мы жили до БЭМа и к чему пришли с ним • Воищев Иван • Factory.mn

Первый взгляд на bem-tools в 2012

• Не хватало технологий для связи с бэкендом

• Мало документации• Высокий порог входа

17 / 60

18 / 60

СОБСТВЕННЫЕ ИНСТРУМЕНТЫ СБОРКИ 2012-2013

Как мы жили до БЭМа и к чему пришли с ним • Воищев Иван • Factory.mn

18 / 60

СОБСТВЕННЫЕ ИНСТРУМЕНТЫ СБОРКИ 2012-2013

• Основа на Zend Framework

Как мы жили до БЭМа и к чему пришли с ним • Воищев Иван • Factory.mn

18 / 60

СОБСТВЕННЫЕ ИНСТРУМЕНТЫ СБОРКИ 2012-2013

• Основа на Zend Framework• Blitz Templates + хелперы

Как мы жили до БЭМа и к чему пришли с ним • Воищев Иван • Factory.mn

18 / 60

СОБСТВЕННЫЕ ИНСТРУМЕНТЫ СБОРКИ 2012-2013

• Основа на Zend Framework• Blitz Templates + хелперы• Собственная система сборки

Как мы жили до БЭМа и к чему пришли с ним • Воищев Иван • Factory.mn

18 / 60

СОБСТВЕННЫЕ ИНСТРУМЕНТЫ СБОРКИ 2012-2013

• Основа на Zend Framework• Blitz Templates + хелперы• Собственная система сборки • Поддержали БЭМ структуру хранения файлов

Как мы жили до БЭМа и к чему пришли с ним • Воищев Иван • Factory.mn

18 / 60

СОБСТВЕННЫЕ ИНСТРУМЕНТЫ СБОРКИ 2012-2013

• Основа на Zend Framework• Blitz Templates + хелперы• Собственная система сборки • Поддержали БЭМ структуру хранения файлов• Сборка в дев. и продакшен режиме

Как мы жили до БЭМа и к чему пришли с ним • Воищев Иван • Factory.mn

18 / 60

СОБСТВЕННЫЕ ИНСТРУМЕНТЫ СБОРКИ 2012-2013

• Основа на Zend Framework• Blitz Templates + хелперы• Собственная система сборки • Поддержали БЭМ структуру хранения файлов• Сборка в дев. и продакшен режиме• Фриз статики

Как мы жили до БЭМа и к чему пришли с ним • Воищев Иван • Factory.mn

18 / 60

СОБСТВЕННЫЕ ИНСТРУМЕНТЫ СБОРКИ 2012-2013

• Основа на Zend Framework• Blitz Templates + хелперы• Собственная система сборки • Поддержали БЭМ структуру хранения файлов• Сборка в дев. и продакшен режиме• Фриз статики • Хеш имен css, js файлов

Как мы жили до БЭМа и к чему пришли с ним • Воищев Иван • Factory.mn

19 / 60

Собственные инструменты сборки

• Ходит в папку с именем блока • Подключает шаблоны, css и jsи др.

20 / 60

Собственные инструменты сборки

Как мы жили до БЭМа и к чему пришли с ним • Воищев Иван • Factory.mn

20 / 60

Собственные инструменты сборки

Как мы жили до БЭМа и к чему пришли с ним • Воищев Иван • Factory.mn

20 / 60

Собственные инструменты сборки

Как мы жили до БЭМа и к чему пришли с ним • Воищев Иван • Factory.mn

21 / 60

Собственные инструменты сборки

Как мы жили до БЭМа и к чему пришли с ним • Воищев Иван • Factory.mn

ПЛЮСЫ

21 / 60

• Не нужно было каждый раз компилировать (в bem-tools это появилось позже)

Собственные инструменты сборки

Как мы жили до БЭМа и к чему пришли с ним • Воищев Иван • Factory.mn

ПЛЮСЫ

21 / 60

• Не нужно было каждый раз компилировать (в bem-tools это появилось позже)

• Работали с привычным шаблонизатором

Собственные инструменты сборки

Как мы жили до БЭМа и к чему пришли с ним • Воищев Иван • Factory.mn

ПЛЮСЫ

21 / 60

• Не нужно было каждый раз компилировать (в bem-tools это появилось позже)

• Работали с привычным шаблонизатором• Заточен под наши процессы

Собственные инструменты сборки

Как мы жили до БЭМа и к чему пришли с ним • Воищев Иван • Factory.mn

ПЛЮСЫ

Собственные инструменты сборки

Как мы жили до БЭМа и к чему пришли с ним • Воищев Иван • Factory.mn

МИНУСЫ

22 / 60

• Нужно поддерживать и развивать

Собственные инструменты сборки

Как мы жили до БЭМа и к чему пришли с ним • Воищев Иван • Factory.mn

МИНУСЫ

22 / 60

• Нужно поддерживать и развивать• Часть логики представления в контролерах

Собственные инструменты сборки

Как мы жили до БЭМа и к чему пришли с ним • Воищев Иван • Factory.mn

МИНУСЫ

22 / 60

• Нужно поддерживать и развивать• Часть логики представления в контролерах• Подсветка синтаксиса

Собственные инструменты сборки

Как мы жили до БЭМа и к чему пришли с ним • Воищев Иван • Factory.mn

МИНУСЫ

22 / 60

• Нужно поддерживать и развивать• Часть логики представления в контролерах• Подсветка синтаксиса• Нет документации

Собственные инструменты сборки

Как мы жили до БЭМа и к чему пришли с ним • Воищев Иван • Factory.mn

МИНУСЫ

22 / 60

• Нужно поддерживать и развивать• Часть логики представления в контролерах• Подсветка синтаксиса• Нет документации• Нет переопределения шаблонов

Собственные инструменты сборки

Как мы жили до БЭМа и к чему пришли с ним • Воищев Иван • Factory.mn

МИНУСЫ

22 / 60

8 / 94

myweddy.ru

ТЕМЫ ОФОРМЛЕНИЯ

Myweddy.ru

Как мы жили до БЭМа и к чему пришли с ним • Воищев Иван • Factory.mn 24 / 60

Myweddy.ru

8 / 94

8 / 94

8 / 94

ПАЛИТРЫ ТЕМ

Myweddy.ru

Как мы жили до БЭМа и к чему пришли с ним • Воищев Иван • Factory.mn 28 / 60

29 / 60

Как мы жили до БЭМа и к чему пришли с ним • Воищев Иван • Factory.mn 30 / 60

8 / 94

СНОВА BEM STACK? Профит с 2013

Как мы жили до БЭМа и к чему пришли с ним • Воищев Иван • Factory.mn 32 / 60

СНОВА BEM STACK?• Появилась BEMTREE технология

Профит с 2013

Как мы жили до БЭМа и к чему пришли с ним • Воищев Иван • Factory.mn 32 / 60

СНОВА BEM STACK?• Появилась BEMTREE технология• bem-tools решает почти все задачи, поставленные перед инструментом

Профит с 2013

Как мы жили до БЭМа и к чему пришли с ним • Воищев Иван • Factory.mn 32 / 60

СНОВА BEM STACK?• Появилась BEMTREE технология• bem-tools решает почти все задачи, поставленные перед инструментом• CSS препроцессор на выбор из коробки

Профит с 2013

Как мы жили до БЭМа и к чему пришли с ним • Воищев Иван • Factory.mn 32 / 60

СНОВА BEM STACK?• Появилась BEMTREE технология• bem-tools решает почти все задачи, поставленные перед инструментом• CSS препроцессор на выбор из коробки• Шаблонизатор, в котором можно всё

Профит с 2013

Как мы жили до БЭМа и к чему пришли с ним • Воищев Иван • Factory.mn 32 / 60

СНОВА BEM STACK?• Появилась BEMTREE технология• bem-tools решает почти все задачи, поставленные перед инструментом• CSS препроцессор на выбор из коробки• Шаблонизатор, в котором можно всё• Больше нет проблем с подсветкой синтаксиса BEMHTML

Профит с 2013

Как мы жили до БЭМа и к чему пришли с ним • Воищев Иван • Factory.mn 32 / 60

СНОВА BEM STACK?• Появилась BEMTREE технология• bem-tools решает почти все задачи, поставленные перед инструментом• CSS препроцессор на выбор из коробки• Шаблонизатор, в котором можно всё• Больше нет проблем с подсветкой синтаксиса BEMHTML• Модульная система для JS

Профит с 2013

Как мы жили до БЭМа и к чему пришли с ним • Воищев Иван • Factory.mn 32 / 60

СНОВА BEM STACK?• Появилась BEMTREE технология• bem-tools решает почти все задачи, поставленные перед инструментом• CSS препроцессор на выбор из коробки• Шаблонизатор, в котором можно всё• Больше нет проблем с подсветкой синтаксиса BEMHTML• Модульная система для JS• Любой бэкэнд

Профит с 2013

Как мы жили до БЭМа и к чему пришли с ним • Воищев Иван • Factory.mn 32 / 60

СНОВА BEM STACK?• Появилась BEMTREE технология• bem-tools решает почти все задачи, поставленные перед инструментом• CSS препроцессор на выбор из коробки• Шаблонизатор, в котором можно всё• Больше нет проблем с подсветкой синтаксиса BEMHTML• Модульная система для JS• Любой бэкэнд• Появилась актуальная документация

Профит с 2013

Как мы жили до БЭМа и к чему пришли с ним • Воищев Иван • Factory.mn 32 / 60

Пример BEMTREE !

33 / 60

Пример BEMTREE !

33 / 60

Доопределение BEMHTML !

Как мы жили до БЭМа и к чему пришли с ним • Воищев Иван • Factory.mn 34 / 60

Доопределение BEMHTML !

Как мы жили до БЭМа и к чему пришли с ним • Воищев Иван • Factory.mn 34 / 60

Доопределение BEMHTML !

Как мы жили до БЭМа и к чему пришли с ним • Воищев Иван • Factory.mn 34 / 60

Доопределение BEMHTML !

Как мы жили до БЭМа и к чему пришли с ним • Воищев Иван • Factory.mn 34 / 60

Доопределение BEMHTML !

Как мы жили до БЭМа и к чему пришли с ним • Воищев Иван • Factory.mn 34 / 60

РЕЗУЛЬТАТ СБОРКИ

Как мы жили до БЭМа и к чему пришли с ним • Воищев Иван • Factory.mn 35 / 60

РЕЗУЛЬТАТ СБОРКИ• _common.bemtree.js

Как мы жили до БЭМа и к чему пришли с ним • Воищев Иван • Factory.mn 35 / 60

РЕЗУЛЬТАТ СБОРКИ• _common.bemtree.js• _common.bemhtml.js

Как мы жили до БЭМа и к чему пришли с ним • Воищев Иван • Factory.mn 35 / 60

РЕЗУЛЬТАТ СБОРКИ• _common.bemtree.js• _common.bemhtml.js• _common.js

Как мы жили до БЭМа и к чему пришли с ним • Воищев Иван • Factory.mn 35 / 60

РЕЗУЛЬТАТ СБОРКИ• _common.bemtree.js• _common.bemhtml.js• _common.js• _common.css (Autoprefixer)

Как мы жили до БЭМа и к чему пришли с ним • Воищев Иван • Factory.mn 35 / 60

РЕЗУЛЬТАТ СБОРКИ• _common.bemtree.js• _common.bemhtml.js• _common.js• _common.css (Autoprefixer)• папка с фризом (img, fonts, svg …)

Как мы жили до БЭМа и к чему пришли с ним • Воищев Иван • Factory.mn 35 / 60

DATA  → BEMTREE → BEMHTML → HTML

Как мы жили до БЭМа и к чему пришли с ним • Воищев Иван • Factory.mn 36 / 60

DATA  → BEMTREE → BEMHTML → HTML

Как мы жили до БЭМа и к чему пришли с ним • Воищев Иван • Factory.mn

Бекэнд сервер

json

36 / 60

DATA  → BEMTREE → BEMHTML → HTML

Nodejs

Как мы жили до БЭМа и к чему пришли с ним • Воищев Иван • Factory.mn

Бекэнд сервер

json

36 / 60

DATA  → BEMTREE → BEMHTML → HTML

Nodejs

Как мы жили до БЭМа и к чему пришли с ним • Воищев Иван • Factory.mn

bemjson

Бекэнд сервер

json

36 / 60

ВОРКФЛОУ

Как мы жили до БЭМа и к чему пришли с ним • Воищев Иван • Factory.mn 37 / 60

ВОРКФЛОУ• Простой редактор кода

Как мы жили до БЭМа и к чему пришли с ним • Воищев Иван • Factory.mn 37 / 60

ВОРКФЛОУ• Простой редактор кода• Препроцессор css

Как мы жили до БЭМа и к чему пришли с ним • Воищев Иван • Factory.mn 37 / 60

ВОРКФЛОУ• Простой редактор кода• Препроцессор css• npm, bower, bem, [git hooks, jshint, jscs, csscomb…]

Как мы жили до БЭМа и к чему пришли с ним • Воищев Иван • Factory.mn 37 / 60

ВОРКФЛОУ• Простой редактор кода• Препроцессор css• npm, bower, bem, [git hooks, jshint, jscs, csscomb…]• Любой бекэнд сервер

Как мы жили до БЭМа и к чему пришли с ним • Воищев Иван • Factory.mn 37 / 60

Как мы жили до БЭМа и к чему пришли с ним • Воищев Иван • Factory.mn 38 / 60

myweddy.ru ashifin-gubernator.ru posmotri-vrn.ru

voronezharts.ru domjourvrn.ru

?

БИБЛИОТЕКИ БЛОКОВ

Как мы жили до БЭМа и к чему пришли с ним • Воищев Иван • Factory.mn 39 / 60

БИБЛИОТЕКИ БЛОКОВ• bem-core

Как мы жили до БЭМа и к чему пришли с ним • Воищев Иван • Factory.mn 39 / 60

БИБЛИОТЕКИ БЛОКОВ• bem-core• bem-components

Как мы жили до БЭМа и к чему пришли с ним • Воищев Иван • Factory.mn 39 / 60

БИБЛИОТЕКИ БЛОКОВ• bem-core• bem-components• bem-font

Как мы жили до БЭМа и к чему пришли с ним • Воищев Иван • Factory.mn 39 / 60

БИБЛИОТЕКИ БЛОКОВ• bem-core• bem-components• bem-font• bem-social

Как мы жили до БЭМа и к чему пришли с ним • Воищев Иван • Factory.mn 39 / 60

БИБЛИОТЕКИ БЛОКОВ• bem-core• bem-components• bem-font• bem-social• bem-factory

Как мы жили до БЭМа и к чему пришли с ним • Воищев Иван • Factory.mn 39 / 60

БИБЛИОТЕКИ БЛОКОВ• bem-core• bem-components• bem-font• bem-social• bem-factory• manufactura-bl

Как мы жили до БЭМа и к чему пришли с ним • Воищев Иван • Factory.mn 39 / 60

БИБЛИОТЕКИ БЛОКОВ• bem-core• bem-components• bem-font• bem-social• bem-factory• manufactura-bl• factory-fonts

Как мы жили до БЭМа и к чему пришли с ним • Воищев Иван • Factory.mn 39 / 60

checkbox

checkbox

bem-components / popup + menu

checkbox

bem-components / popup + menu

link linklink

checkbox

bem-components / popup + menu

link linklink

factory-fonts

bem-factory / fancybox

bem-factory / fancybox

bem-components / menu

manufactura-bl / slider

bem-components / button

bem-components / button

popup4input select

textarea button

bem-social

manufactura-bl / map

bem-social

manufactura-bl / map

factory

bem-social

Как мы жили до БЭМа и к чему пришли с ним • Воищев Иван • Factory.mn 45 / 60

Как мы жили до БЭМа и к чему пришли с ним • Воищев Иван • Factory.mn 45 / 60

BEM-FONT

Как мы жили до БЭМа и к чему пришли с ним • Воищев Иван • Factory.mn

https://github.com/voischev/bem-font

46 / 60

BEM-FONT

Как мы жили до БЭМа и к чему пришли с ним • Воищев Иван • Factory.mn

https://github.com/voischev/bem-font

47 / 60

BEM-FONT

Как мы жили до БЭМа и к чему пришли с ним • Воищев Иван • Factory.mn

https://github.com/voischev/bem-font

48 / 60

BEM-FONT

Как мы жили до БЭМа и к чему пришли с ним • Воищев Иван • Factory.mn

https://github.com/voischev/bem-font

49 / 60

BEM-FONT

Как мы жили до БЭМа и к чему пришли с ним • Воищев Иван • Factory.mn

https://github.com/voischev/bem-font

50 / 60

8 / 94

BEM-SOCIAL

Как мы жили до БЭМа и к чему пришли с ним • Воищев Иван • Factory.mn

https://github.com/voischev/bem-social

Однообразное API блоков

8 / 94

BEM-SOCIAL

Как мы жили до БЭМа и к чему пришли с ним • Воищев Иван • Factory.mn

https://github.com/voischev/bem-social

Однообразное API блоков

BEM-SOCIAL

Как мы жили до БЭМа и к чему пришли с ним • Воищев Иван • Factory.mn

https://github.com/voischev/bem-social

52 / 60

BEM-SOCIAL

Как мы жили до БЭМа и к чему пришли с ним • Воищев Иван • Factory.mn

https://github.com/voischev/bem-social

52 / 60

BEM-FACTORY

Как мы жили до БЭМа и к чему пришли с ним • Воищев Иван • Factory.mn

https://github.com/factorymn/bem-factory

• reset-css • jquery__ui • fancybox • … 

53 / 60

ВНУТРЕННИЕ РАЗРАБОТКИ

Как мы жили до БЭМа и к чему пришли с ним • Воищев Иван • Factory.mn

• manufactura-bl • factory-fonts • свой project-stub

54 / 60

ИТОГИ

Как мы жили до БЭМа и к чему пришли с ним • Воищев Иван • Factory.mn 55 / 60

ИТОГИ

Как мы жили до БЭМа и к чему пришли с ним • Воищев Иван • Factory.mn

• Полное разделение ответственности у разработчиков

55 / 60

ИТОГИ

Как мы жили до БЭМа и к чему пришли с ним • Воищев Иван • Factory.mn

• Полное разделение ответственности у разработчиков• Автоматизация

55 / 60

ИТОГИ

Как мы жили до БЭМа и к чему пришли с ним • Воищев Иван • Factory.mn

• Полное разделение ответственности у разработчиков• Автоматизация• Реиспользуемый код

55 / 60

ИТОГИ

Как мы жили до БЭМа и к чему пришли с ним • Воищев Иван • Factory.mn

• Полное разделение ответственности у разработчиков• Автоматизация• Реиспользуемый код• Библиотеки блоков

55 / 60

ИТОГИ

Как мы жили до БЭМа и к чему пришли с ним • Воищев Иван • Factory.mn

• Полное разделение ответственности у разработчиков• Автоматизация• Реиспользуемый код• Библиотеки блоков• Один язык общения для всей команды

55 / 60

ИТОГИ

Как мы жили до БЭМа и к чему пришли с ним • Воищев Иван • Factory.mn

• Полное разделение ответственности у разработчиков• Автоматизация• Реиспользуемый код• Библиотеки блоков• Один язык общения для всей команды• Простая поддержка

55 / 60

ИТОГИ

Как мы жили до БЭМа и к чему пришли с ним • Воищев Иван • Factory.mn

• Полное разделение ответственности у разработчиков• Автоматизация• Реиспользуемый код• Библиотеки блоков• Один язык общения для всей команды• Простая поддержка• Уменьшились сроки разработки

55 / 60

ИТОГИ

Как мы жили до БЭМа и к чему пришли с ним • Воищев Иван • Factory.mn

• Полное разделение ответственности у разработчиков• Автоматизация• Реиспользуемый код• Библиотеки блоков• Один язык общения для всей команды• Простая поддержка• Уменьшились сроки разработки• Комьюнити

55 / 60

ПРО СРОКИ

Как мы жили до БЭМа и к чему пришли с ним • Воищев Иван • Factory.mn 56 / 60

МЭР ГУБЕРНАТОР

Frontend 198 217

Backend 180 80

378 часов 297 часов

ПРО СРОКИ

Как мы жили до БЭМа и к чему пришли с ним • Воищев Иван • Factory.mn 56 / 60

МЭР ГУБЕРНАТОР

Frontend 198 217

Backend 180 80

378 часов 297 часов(- 81 час)

Как мы жили до БЭМа и к чему пришли с ним • Воищев Иван • Factory.mn 57 / 60

Как мы жили до БЭМа и к чему пришли с ним • Воищев Иван • Factory.mn

ВАКАНСИИ !

ВЕБ-ПРОГРАМ- МИСТ

ТЕХНОЛОГИИ

iOS-ПРОГРАМ-МИСТ

ТЕХНОЛОГИИ

МЕНЕДЖЕР ПО ПРОДАЖАМ

ЗАКОН И ПОРЯДОК

JOBS. FACTORY. MN

И ДРУГИЕ59 / 60

Как мы жили до БЭМа и к чему пришли с ним • Воищев Иван • Factory.mn

@VOISCHEV

59 / 60

THANKUwww.factory.mn

МАНУФАКТУРАИнтерактивное агентство

voischev@factory.mn@voischev

voischev

СПАСИБО

ВОИЩЕВ ИВАН

Как мы жили до БЭМа и к чему пришли с ним • Воищев Иван • Factory.mn 60 / 60