Посмотреть записи докладов за 2014 год в разделе "Фронтэнд" из библиотеки мероприятий Яндекса

Доклад от 30 октября 2014, Yet another Conference в Москве. Ссылка на доклад

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

Доклад от 18 апреля 2014, BEMup в Минске. Ссылка на доклад

На встречах сообщества мы уже знакомили участников с технологической историей проекта. Теперь мы расскажем о людях, которые стоят за этими технологиями. Мы познакомим вас с командой проекта и внутри Яндекса, и снаружи. Остановимся на проектах и компаниях, использующих БЭМ в своей работе, как в СНГ, так и за его пределами. Вспомним забавные случаи и детские радости, бессонные ночи и ваши отзывы, которые вселяют в нас веру в прекрасный новый мир. Приоткроем завесу тайны и заглянем в Зазеркалье внутрь Яндекса с его общепортальной библиотекой блоков Лего и своим циклом БЭМ-развития, где есть место онлайн-активностям, внутренним офлайн-BEMup’ам, совместной разработке и непростым коммуникационным процессам. Поделимся нашим опытом решения тех или иных задач и расскажем, как планируем развиваться в 2014 году. Надеемся, что из этого рассказа вы сможете вынести для себя полезные уроки о работе внутри сообщества и вместе с нами.

Доклад от 18 апреля 2014, BEMup в Минске. Ссылка на доклад

Мы поговорим о том, что нового есть в последних релизах наших самых популярных библиотек, bem-bl и bem-core, и какую пользу вы можете из этого извлечь. Обсудим инструменты для работы с файлами — bem-tools, borschik — и дадим ответы на вопросы пользователей. Углубимся в то, что происходит под капотом нашего любимого bem.info, какой контент в скором времени появится на сайте и какие изменения ожидают наш код. Раскроем карты и покажем альфа-версию нашей новой библиотеки bem-components, разработанной с учётом предыдущего опыта и с помощью передовых технологий. Блоки библиотеки представлены в новом дизайне Яндекса, который поставляется из коробки, однако он опционален. Нам хочется, чтобы early adopters сообщества БЭМ уже попробовали продукт, который мы только разрабатываем. Подытожим тем, зачем всё это вам и как вы можете участвовать в развитии БЭМа.

Доклад от 17 мая 2014, BEMup в Москве. Ссылка на доклад

Поговорим об организации нового фронтенда в Альфа-Банке: как подружить шаблонизатор BEMHTML, bem-tools и AngularJS с Yeoman и Gulp. Мы рассмотрим проект, в котором используются все эти инструменты, а также внутренние и опенсорсные библиотеки блоков, и узнаем, как уровни переопределения помогают свести написание стилей для новых проектов к минимуму и почему вообще это нужно.

Доклад от 17 мая 2014, BEMup в Москве. Ссылка на доклад

Начиная БЭМ-проект, разработчик в первую очередь создает конфигурационный файл для сборщика. И для enb, и для bem-tools это довольно трудоемкий процесс, в ходе которого часто возникают ошибки. Для экономии времени и уменьшения порога вхождения в инструменты для сборки мы решили создать генератор конфигурационных файлов, который позволяет конфигурировать сборку без погружения в API инструментов. Я расскажу, как легко и быстро начать БЭМ-проект при помощи генератора. Вы получите основу в считанные минуты, для этого достаточно ответить на несколько наводящих вопросов.

Доклад от 17 мая 2014, BEMup в Москве. Ссылка на доклад

Мы поговорим о том, как создать эффективный и надёжный код, переложив всю лишнюю работу на роботов. Решим проблему с разным окружением у разработчиков (vagrant), научимся писать стили удобно (roole, autoprefixer), оптимизируем получившийся CSS (clean-css, CSScomb) и графику (Imagemin, SVGO), проверим js-код (jshint, jshint-groups, jscs), убедимся, что некрасивый код не попадёт в репозиторий (git-hooks), и обсудим, как можно быстро и легко создавать новые инструменты. Автоматизируем всё, что можно, и подумаем, что и почему — нельзя!

Доклад от 18 апреля 2014, BEMup в Минске. Ссылка на доклад

PandaDoc — веб-приложение на Angular.js, написанное командой из четырёх фронтенд-разработчиков. Lean startup по определению очень гибкий, и соответственно, вёрстка в нем часто меняется. В рассказе пойдёт речь о том, как в таких условиях мутировал БЭМ и как нужно было организовать вёрстку, чтобы обеспечить высокую реюзабельность стилей, простоту и скорость разработки.

Доклад от 17 мая 2014, BEMup в Москве. Ссылка на доклад

При разработке новых библиотек bem-core и bem-components мы переосмыслили свой подход и предыдущий опыт. Теперь разработка — это честный опенсорс с прозрачным планированием, где каждый может повлиять на результат. Мы сформулировали требования: тотальная автоматизация, Bleeding Edge, оптимизация, разные варианты поставки библиотеки, поддержка нескольких визуальных тем, бережность и кругозор. И определили технологии: анализаторы кода, юнит-тесты, модульность, шаблонизаторы, работа с CSS, зависимости и сборка. В докладе я подробно остановлюсь на каждом из этих вопросов.

Доклад от 17 мая 2014, BEMup в Москве. Ссылка на доклад

Каждый разработчик интерфейсов долгоживущих сервисов сталкивается с регрессиями в вёрстке. Мы научились пользоваться инструментами для unit-тестирования js-кода, но до сих пор плохо понимаем, как тестировать на регрессии вёрстку. И ещё хуже понимаем, как делать это автоматически (continuous integration) и при этом писать небольшие и не очень хрупкие тесты. В этом году мы создали Gemini — инструмент для модульного тестирования вёрстки для нашей библиотеки компонентов. Мы используем его для тестирования внутренней библиотеки компонентов Яндекса, которая лежит в основе большинства наших сервисов. На BEMup я расскажу, как использовать этот инструмент — как разрабатывать тесты и запускать их на локальной машине или в уже существующей экосистеме (Travis CI, Sauce Labs).

Доклад от 30 октября 2014, Yet another Conference в Москве. Ссылка на доклад

Постпроцессоры, SVG, автоматизация разработки и тестирования, эксперименты в браузере, живое документирование и многое другое.

Доклад от 30 октября 2014, Yet another Conference в Москве. Ссылка на доклад

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

Доклад от 30 октября 2014, Yet another Conference в Москве. Ссылка на доклад

В 2014 году принципы Extensible Web начали воплощаться в новых стандартах. Поговорим о Web Crypto, Web Animations, Service Worker и других вещах, которые должны принципиально изменить веб-платформу в ближайшем будущем.

Видео от 30 октября 2014, Yet another Conference в Москве. Ссылка на дискуссию

Доклад от 17 мая 2014, BEMup в Москве. Ссылка на доклад

Сейчас на рынке есть множество фронтенд-библиотек, которые так или иначе реализуют MVC-паттерн. По сути, они нужны для облегчения создания и поддержки интерактивных веб-приложений. Для этих же целей и мы разработали библиотеку bem-mvc — она облегчает разработку веб-приложений на существующем БЭМ-стеке. Так, для реализации моделей в bem-mvc используются те же компоненты, что и в библиотеках bem-bl/bem-core. А провязки с представлением осуществляются в БЭМ-терминах для контролов из библиотеки bem-components или произвольных БЭМ-блоков. На прошлых BEMup я уже рассказывал об основных элементах библиотеки bem-mvc и способах их применения. Но то была теория, а на этот раз — меньше слов, больше дела! В прямом эфире мы создадим небольшое приложение для демонстрации возможностей bem-mvc. Пройдем путь от статического макета к действующему приложению. В процессе мы научимся организовывать код приложения, создавать модели, осуществлять провязку моделей и представления и создавать свои типы провязки.

Два доклада от 17 мая 2014, BEMup в Москве. Ссылка на первый доклад и на второй доклад

Вы узнаете, в чём преимущество вёрстки независимыми блоками и что такое «уровни переопределения», познакомитесь с готовыми библиотеками блоков и инструментами для автоматизации сборки. Мы покажем, как разные инструменты для упрощения жизни разработчика, вроде autoprefixer, css-препроцессора roole и модульной системы YModules, встраиваются в процесс разработки на БЭМ и создают по-настоящему удобную платформу. На живом примере мы объясним, в чём польза декларативного подхода, когда одни и те же идеи можно использовать как для CSS, так и для JS. Более того, декларативным шаблонам: BEMHTML и BEMTREE, которые позволяют преобразовывать сырые данные во view-ориентированный BEMJSON, — будет посвящена одна из трёх частей мастер-класса.

Доклад от 6 сентября 2014, BEMup в Санкт-Петербурге. Ссылка на доклад

На прошлых BEMup’ах мы проводили мастер-классы по полному стеку БЭМ-технологий, на которых в реальном времени писали SSSR — агрегатор информации из социальных сетей. В этот раз мы хотим попробовать новый формат и дать вам возможность писать код самим. Для эффективной работы мы приготовим всё необходимое: настроенное окружение, задания с необходимой теоретической справкой, чтобы вы шаг за шагом освоили БЭМ-технологии, и тесты, на которых вы легко проверите, что выполнили задания правильно. И конечно, останемся в полном вашем распоряжении, чтобы отвечать на вопросы, помогать и советовать. Будет весело!

Доклад от 30 октября 2014, Yet another Conference в Москве. Ссылка на доклад

Не секрет, что разработка интерфейсов продукта происходит на стыке двух миров: дизайна и технологий. Мы проанализируем основные тенденции в мире UI и веб-дизайна, рассмотрим новые инструменты и проследим влияние современных веб-технологий на повседневную работу дизайнеров.

Доклад от 30 октября 2014, Yet another Conference в Москве. Ссылка на доклад

Нам повезло — мы живём в эпоху JavaScript-ренессанса. Ленты новостей пестрят яркими названиями: Angular, Backbone, BEM, Polymer, React. Поговорим о том, зачем нам столько инструментов, чем они отличаются и, главное, какой из них выбрать.

Доклад от 6 сентября 2014, BEMup в Санкт-Петербурге. Ссылка на доклад

Мы поговорим о том, как разрабатывается техническая документация к библиотеке bem-components и почему разделение интерфейса на блоки облегчает работу с документами как техническим писателям, так и разработчикам. А также о том, как мы выкладываем всю информацию по каждому блоку с примерами и JSDoc на наш сайт ru.bem.info.

Доклад от 22 ноября 2014, Я.Субботник по фронтенду в Киеве. Ссылка на доклад

Что такое СЕРП? Почему мы не смогли ужиться с IE6-7 и почему для нас было так важно отделить старые браузеры? Я расскажу о проекте «Бабуля», о его пользе и о том, как мы решили с его помощью сразу множество проблем.

Доклад от 22 ноября 2014, Я.Субботник по фронтенду в Киеве. Ссылка на доклад

XSS, несмотря на всю изученность, является одной из самых распространённых уязвимостей сайтов. Даже если вы знаете методы защиты и пишете безопасный код, уверены ли в том, что ваш сайт работает в безопасном окружении? Ведь вирусы и расширения могут менять любые методы и получать доступ к любым данным! К счастью, появился Content Security Policy. За 20 минут я расскажу вам, как с его помощью без особых усилий наладить эффективную защиту сайта от различных видов атак и блокировать выполнение нежелательного кода.

Доклад от 22 ноября 2014, Я.Субботник по фронтенду в Киеве. Ссылка на доклад

Утверждение нового стандарта JavaScript не за горами, и мы должны быть готовы к изменениям, которые он принесёт в язык. Я расскажу об актуальном статусе реализации ES6, а также о том, как начать пользоваться нововведениями уже сейчас.

Доклад от 22 ноября 2014, Я.Субботник по фронтенду в Киеве. Ссылка на доклад

В докладе я расскажу о том, как устроен процесс работы с Git в команде Яндекс.Браузера, с какими задачами мы сталкиваемся и как их решаем. А также поделюсь полезными советами и знаниями, которые вы сможете использовать при работе над своим, пусть даже и небольшим, проектом.

Доклад от 22 ноября 2014, Я.Субботник по фронтенду в Киеве. Ссылка на доклад

В своём докладе я расскажу, как использовал BEM для организации кода небольшого проекта вне Яндекса. Поговорим о том, что такое bem-node, каковы его возможности и как быстро создать с его помощью небольшой, но легко масштабируемый проект на node.js.

Доклад от 22 ноября 2014, Я.Субботник по фронтенду в Киеве. Ссылка на доклад

Я расскажу о прошлом, настоящем и будущем JSCS. Что это за проект и зачем он нужен, как он дополняет стандартные инструменты, отчего стал популярен, какова его архитектура и особенности, чем он отличается от других статических анализаторов кода.

Доклад от 22 ноября 2014, Frontend Party в Нижнем Новгороде. Ссылка на доклад

Одна из ярких тенденций современного веба — бурное развитие так называемой архитектуры одностраничного приложения. Поговорим о том, что вообще такое SPA, чем отличается от привычного стэка технологий, рассмотрим один из вариантов организации SPA при помощи модных инструментов и библиотек, обсудим опыт миграции и границы применимости.

Доклад от 6 сентября 2014, BEMup в Санкт-Петербурге. Ссылка на доклад

Во время учебы в ШРИ и работы в Яндексе мне пришлось вплотную познакомиться с БЭМ и сопутствующими технологиями и инфраструктурой. В докладе я расскажу о своём первом впечатлении и о том, как оно менялось со временем. Также поделюсь опытом контрибьюта в opensource библиотек bem-history и bem-core, а в конце мы попробуем быстро написать простое одностраничное приложение, использующее для своей работы History API и библиотеку bem-history.

Доклад от 6 сентября 2014, BEMup в Санкт-Петербурге. Ссылка на доклад

Под эгидой БЭМ за последние годы было создано много проектов, многие из которых продолжают развиваться и по сей день. Появляются новые проекты как от разработчиков внутри Яндекса, так и членов постоянно растущего БЭМ-сообщества.

Как представить весь объём необходимой информации в рамках одного сайта? Что делать, когда не подходят gh-pages и стандартные CMS? Я расскажу о bem-site-engine — платформе для публикации проектов на БЭМ и не только, об истории разработки сайта bem.info и планах по его развитию.

Доклад от 6 сентября 2014, BEMup в Санкт-Петербурге. Ссылка на доклад

В связи с закрытием Я.ру возникла потребность в простом решении, которое могло бы заменить этот сервис и легко внедриться в другие проекты на БЭМ. Для этого мы разработали bem-forum — форум на полном БЭМ-стеке, использующий GitHub Issues в качестве источника данных. Кроме того, форум на bem.info — это пример проекта с открытым исходным кодом, которым можно пользоваться в виде традиционного приложения на node.js и express.js. Обо всём этом и пойдёт речь в докладе.

Доклад от 6 сентября 2014, BEMup в Санкт-Петербурге. Ссылка на доклад

Я расскажу о быстром прототипировании интерфейсов: почему важно как можно скорее получить живую версию продукта и почему от этого зависит его судьба, как использовать для этого БЭМ-инструментарий и библиотеки, а также как забыть про Photoshop и спать спокойно. Live coding ;)

Доклад от 6 сентября 2014, BEMup в Санкт-Петербурге. Ссылка на доклад

Мы строили-строили. Мы тестировали-тестировали. Мы писали документацию. Некоторые из вас принимали в этом активное участие и уже пользуются плодами работы. Теперь мы хотим поделиться нашими совместными результатами (20 готовых блоков!), рассказать о том, как вы можете ускорить разработку своих проектов, о том, что ждёт впереди, и о том, как сделать свою собственную библиотеку блоков такой же удобной и качественной, как это получилось с библиотекой bem-components.

Доклад от 6 сентября 2014, BEMup в Санкт-Петербурге. Ссылка на доклад

БЭМ-методология — это мощный инструмент для разработки больших проектов. Разделение интерфейса на отдельные сущности помогает выделять общее и частное, но, как и во всём в мире, в БЭМ есть свои недостатки. Работая над большим БЭМ-проектом, легко запутаться, ведь логика одного блока может быть описана на разных уровнях переопределения. В ходе доклада мы рассмотрим наш вариант решения этой проблемы и поговорим о том, как вы можете сделать мир лучше.

Доклад от 6 сентября 2014, BEMup в Санкт-Петербурге. Ссылка на доклад

Некоторые из вас уже используют bem-core@v2, некоторые только думают об этом. Чтобы процесс разработки этой важной библиотеки блоков был более прозрачным и в нём могло участвовать больше людей, я расскажу о наших планах на следующую мажорную версию. Подробно опишу, что именно и как мы собираемся изменить, а с желающими поговорю о том, не надо ли нам всё делать по-другому ;)

Доклад от 22 ноября 2014, Я.Субботник по фронтенду в Киеве. Ссылка на доклад

Я расскажу о том, как мы выбирали модульную систему для API и почему возникла такая необходимость, а также о способах эффективно подгружать и инициализировать модули по запросу. Ещё мы обсудим, что такое предиктор и как использовать все эти наработки при написании плагинов к API Карт и в собственных проектах.

Доклад от 30 августа 2014, Я.Субботник по бекенду в Минске. Ссылка на доклад

Принято считать, что API Карт — это JavaScript-библиотека, которая работает в браузере. Это утверждение верно ровно в той степени, в какой сферичен конь в вакууме. Из доклада вы узнаете, зачем API нужен бэкенд, почему писать его придётся вам и как API Карт будет помогать этой задаче с фронтенда.

Доклад от 22 ноября 2014, Frontend Party в Нижнем Новгороде. Ссылка на доклад

В докладе пойдёт речь о том, как использовать JS-библиотеки и фреймворки для достижения модульности, построения грамотной архитектуры и упрощения поддержки фронтенда веб-приложений. Мы также поговорим о многофункциональной библиотеке Backbone.js и о том, как навести порядок в application.js (main.js).