Сбалансированное окружение для
вашей продуктивности
Алексей Зеленюк, Application Architect
eleks.com
Big blue heading
О чем доклад
● Почему в JS все так сложно?
● Как выглядит современное JS окружение
● Мой первый JS Энтерпрайз
● Все это правда надо?
● Мои менее продвинутые проекты
● Начинаем новый проект
● Что с этим делать?
● Что приводит к сложности?
● Бройлерплейты против велосипедов
● Рельсово-Сиэлайная магия
● Гибридный подход
● Lean Environment
● К чему нужно стремиться?
● С чего нужно начать?
● Что можно отложить?
● Чего бояться?
● Полезные мелочи
● О команде
Сбалансированное окружение
для вашей продуктивности,
Алексей Зеленюк
Современное JS
окружение
1. Package Management
2. Bundling
3. Transpiling
4. Minification
5. Sourcemaps
6. Mocked API
7. Dev Webserver
8. Component Libraries
9. Build automation
10.Production deploy
11.Code Style validation
12.Unit/E2E tests
В придачу
1. Continuous Integration
2. Build automation
3. Production deployment
4. Code-review инструменты и конвенции
5. Tests coverage
6. SDLC специфика, и прочий Agile
Мой первый JS
Энтерпрайз
Python (древней версии)
Ruby gems для компаса и
еще какой-то фигни
Bash скрипты (много)
Backbone забытой версии,
модифицированный
Юнит тесты
E2E тесты
Время сборки ~ 10 минут
Деплой – ~ 1 час
Как-то так…
Когда попадаешь в
менее продвинутый
проект
Когда начинаешь
проект с нуля
Что в итоге?
● Программа обросла библиотеками
● Билд обрастает скриптами
● Проект новыми требованиями
● И новыми костылями
● Много тяжелых тестов
● Сложность растет
● Рефакторить нет времени
● Лепим сверху, сзади и по бокам
● Производительность упала
● А давайте перепишем с нуля?
Начать с чистого листа нетрудно.
Трудно изменить почерк.
П. Коэльо
Избыточная сложность.
Что к ней приводит?
1. Лень/нет времени разбираться
2. Лень/нет времени следить за прогрессом
3. Хайп, погоня за новым
4. Новые требования не вкладываются в архитектуру
5. Неправильные решения и лишние абстракции
6. Пренебрегание рефакторингом
Бройлерплейты
• Экономит время (вначале)
• Фокусируемся на задаче
• Поддерживается
• Full-featured
• Стандартный стек
• Много лишнего
• Меньше понимания
• Трудно расширить
Велосипеды
• Выбираем только нужное
• Больше понимания
• Меньше лишней сложности
• Проще изменить
• Долгий старт
• Нужно поддерживать
• Свое не всегда лучшее
Теплый рельсовый CLI
• Стандартный подход
• Меньше рутины
• Ускоряет вход в проект
• Ускоряет разработку
• Само-документируемость
• Много лишнего кода
• Жесткие рамки
• Постоянная доработка
шаблонов
Гибридный подход
1. Изучить лучшие решения
2. Выбрать наиболее подходящее
3. Пересобрать с оглядкой на него, с нуля
4. Создать шаблоны для CLI
5. Мотивировать коллег (и себя) их использовать
Lean Environment
Less-is-Better
К чему нужно стремиться?
1. Быстрый фидбек
2. Авто-конвенции
3. Масштабируемость
4. [TO BE CONTINUED]
С чего начать?
1. Осмысление требований и 3-party интеграций
2. Понимание потоков данных и интерфейсов
3. Быстрый прототип на бойлерплейте и фидбек
4. EditorConfig и линтеры
5. Юнит-тесты
6. WIP Demo (localtunnel, Surge, etc)
7. Спецификация (Swagger, etc.)
8. Переосмысление и переписывание
Что можно отложить?
1. Твердый выбор фреймворка и утилит
2. Выбор и настройка БД
3. Глубокую декомпозицию
4. Внедрение абстракций
5. DRY принцип
6. Все что можно отложить
YAGNIYou Ain’t Gonna Need It!
Fake it until you make it!
1. [TO BE CONTINUED]
О Команде
1. [TO BE CONTINUED]

More Related Content

PPTX
Как развивать библиотеку компонентов, не ломая ее / Артур Удалов (Mail.Ru Group)
PDF
Александр Курдюков. Внедрение continuous delivery для гетерогенных поставок.
PDF
DevOps модное слово или следующая ступень эволюции
PDF
Мобильный веб: назад в будущее
PDF
Роберт Харитонов — Отдел вёрстки с нуля
PDF
Евгений Джамалов. Agile в условиях мульти-вендорности и распределённых команд.
PDF
О фреймворках / Роман Ивлиев (Банки.ру)
PPTX
Highload в ВУЗе: идеализм, расчетливый менеджмент или пустые надежды
Как развивать библиотеку компонентов, не ломая ее / Артур Удалов (Mail.Ru Group)
Александр Курдюков. Внедрение continuous delivery для гетерогенных поставок.
DevOps модное слово или следующая ступень эволюции
Мобильный веб: назад в будущее
Роберт Харитонов — Отдел вёрстки с нуля
Евгений Джамалов. Agile в условиях мульти-вендорности и распределённых команд.
О фреймворках / Роман Ивлиев (Банки.ру)
Highload в ВУЗе: идеализм, расчетливый менеджмент или пустые надежды

What's hot (19)

PPTX
А. Калугин. О параллельном тестировании нескольких проектов. SQADays'10
PPT
Алексей Рыбак (Badoo)
PPTX
Тестировщик в стартапе. Зачем и как
PDF
Оценка проектов тестирования
PPTX
Гибкое тестирование
PPTX
бородин об эмпирической разработке
PPTX
Всему своё время Highload Junior 2016
PDF
7 Способы проведения ретроспектив для анализа и улучшения процесса
PDF
Continuous integration для java script проектов
PPTX
О фреймворках Backend conf 2016
PDF
DevOps от и до - что, зачем и почему
PDF
Частые ошибки при разработке фронтенда | Odessa Frontend Meetup #17
PDF
Алексей Лустин. Непрерывная проверка качества кода.
PPTX
Как проекты приходят к DevOps?
PPTX
Visual Studio Team Services /TFS helps doing devops
PPTX
Тестирование в условиях Lean: как приручить MVP?
PPTX
Agile мёртв (!|?) / Александр Сидоров (Яндекс)
PPTX
Как мы делаем Banki.ru
PPTX
Темная сторона метрик
А. Калугин. О параллельном тестировании нескольких проектов. SQADays'10
Алексей Рыбак (Badoo)
Тестировщик в стартапе. Зачем и как
Оценка проектов тестирования
Гибкое тестирование
бородин об эмпирической разработке
Всему своё время Highload Junior 2016
7 Способы проведения ретроспектив для анализа и улучшения процесса
Continuous integration для java script проектов
О фреймворках Backend conf 2016
DevOps от и до - что, зачем и почему
Частые ошибки при разработке фронтенда | Odessa Frontend Meetup #17
Алексей Лустин. Непрерывная проверка качества кода.
Как проекты приходят к DevOps?
Visual Studio Team Services /TFS helps doing devops
Тестирование в условиях Lean: как приручить MVP?
Agile мёртв (!|?) / Александр Сидоров (Яндекс)
Как мы делаем Banki.ru
Темная сторона метрик

Viewers also liked (15)

PPTX
JS Lab2017_Евгений Сафронов_Тестирование Javascript кода. Инструменты, практи...
PDF
JS Lab2017_Lightning Talks_React Perfomance
PPTX
JS Lab2017_Под микроскопом: блеск и нищета микросервисов на node.js
PDF
JS Lab2017_Lightning Talks_Рекрутинг.js
PDF
Frontendlab: Cравнить Несравнимое - Юлия Пучнина
PDF
JS Lab2017_Lightning Talks_PostCSS - there is a plugin for that
PDF
JS Lab2017_Андрей Кучеренко _Разработка мультипакетных приложения: причины, с...
PDF
JS Lab2017_Виталий Лебедев_Практические сложности при разработке на node.js
PDF
JS Lab2017_Юлия Пучнина_PhaserJS и что он умеет
PPTX
JS Lab2017_Роман Якобчук_Почему так важно быть программистом в фронтенде
PDF
JS Lab2017_Алексей Заславский_React Fiber
PDF
JS Lab2017_Сергей Селецкий_System.js и jspm
PDF
WebCamp 2016: Python.Максим Климишин.Типизированный Python
PDF
AI&BigData Lab 2016. Сергей Шельпук: Методология Data Science проектов
PDF
JS Lab2017_Redux: время двигаться дальше?_Екатерина Лизогубова
JS Lab2017_Евгений Сафронов_Тестирование Javascript кода. Инструменты, практи...
JS Lab2017_Lightning Talks_React Perfomance
JS Lab2017_Под микроскопом: блеск и нищета микросервисов на node.js
JS Lab2017_Lightning Talks_Рекрутинг.js
Frontendlab: Cравнить Несравнимое - Юлия Пучнина
JS Lab2017_Lightning Talks_PostCSS - there is a plugin for that
JS Lab2017_Андрей Кучеренко _Разработка мультипакетных приложения: причины, с...
JS Lab2017_Виталий Лебедев_Практические сложности при разработке на node.js
JS Lab2017_Юлия Пучнина_PhaserJS и что он умеет
JS Lab2017_Роман Якобчук_Почему так важно быть программистом в фронтенде
JS Lab2017_Алексей Заславский_React Fiber
JS Lab2017_Сергей Селецкий_System.js и jspm
WebCamp 2016: Python.Максим Климишин.Типизированный Python
AI&BigData Lab 2016. Сергей Шельпук: Методология Data Science проектов
JS Lab2017_Redux: время двигаться дальше?_Екатерина Лизогубова

Similar to JS Lab2017_Алексей Зеленюк_Сбалансированное окружение для вашей продуктивности (20)

PDF
Инструменты разные нужны, инструменты разные важны
PDF
Виталий Шибаев - Креативный менеджмент глазами разработчика: как выжить в agi...
PPTX
Test Driven Development in .NET Applications
PPTX
Прикручивание колёс на ходу. Внедрение UX процессов в уже работающий продукт
PDF
Agile Process Wizard или как собрать Agile методологию под конкретный проект
PPTX
Раздвоение тестирующей личности или эффективная организация параллельного тес...
PDF
Константин Назаров – Распараллеливание сборки Parallels Desktop для Mac
PPTX
Форум Технологий Mail.Ru 2011: Юрий Ветров — Как создаются интерфейсы в Mail.Ru
PDF
UWDC'12, Александр Макаров, О командной разработке и фреймворках
PDF
Как разраба
PPT
Микросервисы: первая кровь
PPTX
Как перейти от проектного мышления к продуктовому. Опыт из заказной разработки
PPTX
Эффективные ретроспективы
PDF
CodeFest 2011. Макаров А. — Как разрабатывается Yii
PDF
Как работать с legacy проектом, которому больше10 лет? |Денис Воскобойник
PPTX
Test driven development in net
PDF
PPTX
Юрий Ветров "Как планируется работа команды проектирования и дизайна интерфей...
PDF
Проходим тест Джоэла
PDF
Devconf 2011 - PHP - Как разрабатывается фреймворк Yii
Инструменты разные нужны, инструменты разные важны
Виталий Шибаев - Креативный менеджмент глазами разработчика: как выжить в agi...
Test Driven Development in .NET Applications
Прикручивание колёс на ходу. Внедрение UX процессов в уже работающий продукт
Agile Process Wizard или как собрать Agile методологию под конкретный проект
Раздвоение тестирующей личности или эффективная организация параллельного тес...
Константин Назаров – Распараллеливание сборки Parallels Desktop для Mac
Форум Технологий Mail.Ru 2011: Юрий Ветров — Как создаются интерфейсы в Mail.Ru
UWDC'12, Александр Макаров, О командной разработке и фреймворках
Как разраба
Микросервисы: первая кровь
Как перейти от проектного мышления к продуктовому. Опыт из заказной разработки
Эффективные ретроспективы
CodeFest 2011. Макаров А. — Как разрабатывается Yii
Как работать с legacy проектом, которому больше10 лет? |Денис Воскобойник
Test driven development in net
Юрий Ветров "Как планируется работа команды проектирования и дизайна интерфей...
Проходим тест Джоэла
Devconf 2011 - PHP - Как разрабатывается фреймворк Yii

More from GeeksLab Odessa (19)

PDF
DataScience Lab2017_Коррекция геометрических искажений оптических спутниковых...
PDF
DataScience Lab 2017_Kappa Architecture: How to implement a real-time streami...
PDF
DataScience Lab 2017_Блиц-доклад_Турский Виктор
PDF
DataScience Lab 2017_Обзор методов детекции лиц на изображение
PDF
DataScienceLab2017_Сходство пациентов: вычистка дубликатов и предсказание про...
PDF
DataScienceLab2017_Блиц-доклад
PDF
DataScienceLab2017_Блиц-доклад
PDF
DataScienceLab2017_Блиц-доклад
PDF
DataScienceLab2017_Cервинг моделей, построенных на больших данных с помощью A...
PDF
DataScienceLab2017_BioVec: Word2Vec в задачах анализа геномных данных и биоин...
PDF
DataScienceLab2017_Data Sciences и Big Data в Телекоме_Александр Саенко
PDF
DataScienceLab2017_Высокопроизводительные вычислительные возможности для сист...
PDF
DataScience Lab 2017_Мониторинг модных трендов с помощью глубокого обучения и...
PDF
DataScience Lab 2017_Кто здесь? Автоматическая разметка спикеров на телефонны...
PDF
DataScience Lab 2017_From bag of texts to bag of clusters_Терпиль Евгений / П...
PDF
DataScience Lab 2017_Графические вероятностные модели для принятия решений в ...
PDF
DataScienceLab2017_Оптимизация гиперпараметров машинного обучения при помощи ...
PDF
DataScienceLab2017_Как знать всё о покупателях (или почти всё)?_Дарина Перемот
PDF
JS Lab 2017_Mapbox GL: как работают современные интерактивные карты_Владимир ...
DataScience Lab2017_Коррекция геометрических искажений оптических спутниковых...
DataScience Lab 2017_Kappa Architecture: How to implement a real-time streami...
DataScience Lab 2017_Блиц-доклад_Турский Виктор
DataScience Lab 2017_Обзор методов детекции лиц на изображение
DataScienceLab2017_Сходство пациентов: вычистка дубликатов и предсказание про...
DataScienceLab2017_Блиц-доклад
DataScienceLab2017_Блиц-доклад
DataScienceLab2017_Блиц-доклад
DataScienceLab2017_Cервинг моделей, построенных на больших данных с помощью A...
DataScienceLab2017_BioVec: Word2Vec в задачах анализа геномных данных и биоин...
DataScienceLab2017_Data Sciences и Big Data в Телекоме_Александр Саенко
DataScienceLab2017_Высокопроизводительные вычислительные возможности для сист...
DataScience Lab 2017_Мониторинг модных трендов с помощью глубокого обучения и...
DataScience Lab 2017_Кто здесь? Автоматическая разметка спикеров на телефонны...
DataScience Lab 2017_From bag of texts to bag of clusters_Терпиль Евгений / П...
DataScience Lab 2017_Графические вероятностные модели для принятия решений в ...
DataScienceLab2017_Оптимизация гиперпараметров машинного обучения при помощи ...
DataScienceLab2017_Как знать всё о покупателях (или почти всё)?_Дарина Перемот
JS Lab 2017_Mapbox GL: как работают современные интерактивные карты_Владимир ...

JS Lab2017_Алексей Зеленюк_Сбалансированное окружение для вашей продуктивности

  • 1. Сбалансированное окружение для вашей продуктивности Алексей Зеленюк, Application Architect eleks.com Big blue heading
  • 2. О чем доклад ● Почему в JS все так сложно? ● Как выглядит современное JS окружение ● Мой первый JS Энтерпрайз ● Все это правда надо? ● Мои менее продвинутые проекты ● Начинаем новый проект ● Что с этим делать? ● Что приводит к сложности? ● Бройлерплейты против велосипедов ● Рельсово-Сиэлайная магия ● Гибридный подход ● Lean Environment ● К чему нужно стремиться? ● С чего нужно начать? ● Что можно отложить? ● Чего бояться? ● Полезные мелочи ● О команде Сбалансированное окружение для вашей продуктивности, Алексей Зеленюк
  • 3. Современное JS окружение 1. Package Management 2. Bundling 3. Transpiling 4. Minification 5. Sourcemaps 6. Mocked API 7. Dev Webserver 8. Component Libraries 9. Build automation 10.Production deploy 11.Code Style validation 12.Unit/E2E tests
  • 4. В придачу 1. Continuous Integration 2. Build automation 3. Production deployment 4. Code-review инструменты и конвенции 5. Tests coverage 6. SDLC специфика, и прочий Agile
  • 5. Мой первый JS Энтерпрайз Python (древней версии) Ruby gems для компаса и еще какой-то фигни Bash скрипты (много) Backbone забытой версии, модифицированный Юнит тесты E2E тесты Время сборки ~ 10 минут Деплой – ~ 1 час
  • 7. Когда попадаешь в менее продвинутый проект
  • 9. Что в итоге? ● Программа обросла библиотеками ● Билд обрастает скриптами ● Проект новыми требованиями ● И новыми костылями ● Много тяжелых тестов ● Сложность растет ● Рефакторить нет времени ● Лепим сверху, сзади и по бокам ● Производительность упала ● А давайте перепишем с нуля?
  • 10. Начать с чистого листа нетрудно. Трудно изменить почерк. П. Коэльо
  • 11. Избыточная сложность. Что к ней приводит? 1. Лень/нет времени разбираться 2. Лень/нет времени следить за прогрессом 3. Хайп, погоня за новым 4. Новые требования не вкладываются в архитектуру 5. Неправильные решения и лишние абстракции 6. Пренебрегание рефакторингом
  • 12. Бройлерплейты • Экономит время (вначале) • Фокусируемся на задаче • Поддерживается • Full-featured • Стандартный стек • Много лишнего • Меньше понимания • Трудно расширить
  • 13. Велосипеды • Выбираем только нужное • Больше понимания • Меньше лишней сложности • Проще изменить • Долгий старт • Нужно поддерживать • Свое не всегда лучшее
  • 14. Теплый рельсовый CLI • Стандартный подход • Меньше рутины • Ускоряет вход в проект • Ускоряет разработку • Само-документируемость • Много лишнего кода • Жесткие рамки • Постоянная доработка шаблонов
  • 15. Гибридный подход 1. Изучить лучшие решения 2. Выбрать наиболее подходящее 3. Пересобрать с оглядкой на него, с нуля 4. Создать шаблоны для CLI 5. Мотивировать коллег (и себя) их использовать
  • 17. К чему нужно стремиться? 1. Быстрый фидбек 2. Авто-конвенции 3. Масштабируемость 4. [TO BE CONTINUED]
  • 18. С чего начать? 1. Осмысление требований и 3-party интеграций 2. Понимание потоков данных и интерфейсов 3. Быстрый прототип на бойлерплейте и фидбек 4. EditorConfig и линтеры 5. Юнит-тесты 6. WIP Demo (localtunnel, Surge, etc) 7. Спецификация (Swagger, etc.) 8. Переосмысление и переписывание
  • 19. Что можно отложить? 1. Твердый выбор фреймворка и утилит 2. Выбор и настройка БД 3. Глубокую декомпозицию 4. Внедрение абстракций 5. DRY принцип 6. Все что можно отложить YAGNIYou Ain’t Gonna Need It!
  • 20. Fake it until you make it! 1. [TO BE CONTINUED]
  • 21. О Команде 1. [TO BE CONTINUED]