В прошедшую субботу в офисе Avito прошел SPA Meetup. Это митап-сателит Moscow.js, ориентированный на фронтенд-разработчиков, которым интересна тема веб-приложений (Single Page Application), и сочувствующих им. Это уже третья встреча, которая получилась весьма насыщенной: 3 доклада, 2 блица, свободный микрофон, панельная дискуссия и, конечно же, живое общение. В этом посте мы немного расскажем о том, как это было, и поделимся видеозаписями докладов.
Доклады
Встречу открыл Александр Лобашев из Avito докладом про дизайн-платформу. Сегодня все больше команд начинают использовать различные инструменты и системы для работы с компонентами и их композициями. Такие решения призваны облегчить и оптимизировать работу фронтенд-разработки, а также улучшить взаимодействие с другими функциями, такими как дизайн и тестирование. Решений становится больше и это здорово, но часто оказывается, что большим компаниям и проектам готовые решения не подходят, и тогда создается собственное.
Продолжил встречу разработчик Badoo Максим Кислов рассказом об опыте использования технологии Protocol buffers (или просто protobuf). Механизм предназначен для сериализации данных, при этом не зависит ни от платформы, ни от языка. Изначально решение предназначалось для серверной части, но со временем стало доступно и для клиент-сайда, в том числе фронтенда. Решаемая проблема становится острой для больших проектов, так как со временем функциональности становится все больше, меняются начальные требования, появляется legacy, поддерживать протоколы взаимодействия разных частей проекта становится все сложней. Protocol buffers дает достойный ответ и позволяет Badoo, например, использовать единый протокол взаимодействия между бекендом, мобильными приложениями и фронтендом.
Третий доклад от Романа Дворнова из Avito затронул тему создания собственных dev инструментов, которые помогают в разработке веб-приложений, предоставляя удаленный доступ к их runtime. Звучит сложно, и местами так оно и есть, но теперь есть решение, облегчающее создание таких инструментов. Решение называется rempl, оно позволяет сфокусироваться на самом инструменте и меньше думать об инфраструктуре. Несколько примеров инструментов (и не только) уже построенных на rempl: анализатор процессов и результата сборки в Webpack, удаленный инспектор компонент, пульт управления презентацией на Shower — и это только начало. Из доклада вы узнаете про сценарии использования, как это все работает, а кроме того там есть демо с лайв-кодингом.
Блитц
Далее в программе было два блиц-доклада. Никита Мостовой из HeadHunter поднял тему стабов для тестирования. Он поделился собственным опытом, как сделать удобно и бекенду и фронтенду.
Второй блиц, от представителя Zeeng Александра Сафта, о том, как валидировать данные от сложных форм и синхронизировать валидацию с фронтендом. Одно из решений этой проблемы — использовать специальный JSON, а точнее JSON-schema. Об этом и рассказал Александр с большим количеством примеров кода.
Свободный микрофон
В качестве эксперимента, мы предоставили возможность участникам рассказать про свои open source проекты. Эксперимент удался, были представлены следующие инструменты:
- Роман Дворнов рассказал про CSSTree — быстрый детальный парсер CSS с возможностью валидации согласно спецификациям W3C. Судя по эксперименту, в ходе которого были провалидированы сайты Alexa Top 250, почти на каждом сайте есть ошибки в CSS. CSSTree может помочь вам избежать ошибок в ваших проектах.
- Александр Мехоношин поделился своей наработкой Npm Api Service, с помощью которой можно настроить поиск и переход к репозиторию любого npm-пакета как в Alfred, так и прямо в адресной строке любого Chromium-браузера
- Амбициозный проект Алексея Охрименко SimplePEG позволяет создавать свой парсер, описывая его грамматику с помощью простых конструкций. Главное отличие SimplePEG от PEG в том, что можно сгенерировать код парсера не только на JavaScript, но и на Python, а в перспективе на любом другом языке.
- Ввиду нехватки времени Константин Лебедев хочет отдать свой проект Sortable в добрые руки. Это хорошая возможность стать мейнтенером популярной библиотеки (~10k звезд на GitHub, ~100k скачиваний только в npm), которая позволяет сортировать списки перетаскиванием и имеет множество интеграций.
Дискуссия
В завершении встречи мы провели панельную дискуссию. В ней приняли участие Александр Лобашев (Avito), Константин Лебедев (Mail.ru), Алексей Охрименко (IPONWEB), Анастасия Горячева (Avito) и Александр Майоров (tutu.ru). Тема дискуссии — компоненты и компонентный подход.
Пересказывать дискуссию — неблагодарное занятие, лучше посмотреть запись. Но стоит отметить, что ближе к середине, когда речь зашла про подходы и все-в-js, страсти накалились. В какой-то момент микрофон захватил Денис Иогансен (LiveJournal) и плавно стал участником панели, чем оживил обсуждение :) Было жарко, час пролетел незаметно и его явно не хватило. Поэтому дальнейшие обсуждения продолжились уже в неформальной обстановке, и это было не менее увлекательно.
Все материалы со SPA meetup #3 вы найдете по ссылкам:
Спасибо всем, кто пришел на митап, смотрел трансляцию и активно участвовал в организации. Было здорово!
Одно из основных пожеланий в отзывах – проводить такие встречи чаще, сейчас они проходят ежегодно. Отличное предложение! Попробуем проводить SPA meetup чаще, как наберется достаточно тем и докладчиков. Если у вас есть что рассказать, присылайте заявки Роману Дворнову или на team@moscowjs.ru. Не забудьте подписаться на анонсы SPA Meetup на Timepad или твиттер @moscowjs, чтобы не пропустить следующий митап. До новых встреч!
