Привет, эту неделю проведу с вами я, @boriscoder. Я работаю в отделе тестирования Яндекса и мы будем говорить о тестировании.

Для начала расскажите о том, какими тестовыми фреймворками и библиотеками пользуетесь. Mocha, Jasmine, что-нибудь еще?

@jsunderhood помимо указанного чай, стамбул и gemini

Я занимаюсь в компании разработкой инструментов для тестирования. Наша команда поддерживает инфраструктуру для запуска автотестов

.@jsunderhood можно спрашивать меня о разных тонкостях тестирования. Как правильно писать тестовый код? Как ускорить медленные тесты?

.@jsunderhood проще взять Jasmine и написать хелперов под свой проект. Легче будет интегрироваться с Teamcity в один отчет с unit-тестами

@jsunderhood но фронтенд по большей части это визуализация и в основном это работа с домом, это юнит тестами не покрыть, разве нет?

.@hellbeast92 можно создать себе тестовый dom-фрагмент, и тестировать в нем. CSS так не проверить, а логику и html можно.

@jsunderhood @toivonens сам не пробовал //cc @mourner

Made a new awesome library for pixel-level image comparison (e.g. for regression tests on screenshots) github.com/mapbox/pixelma…

15:26

.@yuritkachenko @toivonens @mourner там слишком строгий diff, будет много шума. Это как верстку с макетом попиксельно сравнивать.

.@toivonens @yuritkachenko @mourner конечно. Тени, границы могут немного отличаться. В Gemini этот кактус долго кушали. //cc @SevInf

Ну и давайте под вечер померяемся coverage. Сколько должно быть для уверенности в своих тестах? 20? 50?

.@jsunderhood кто-нибудь знает хорошие инструменты, которые скажут "ты проверил только положительные числа, иди проверяй отрицательные"?

@jsunderhood Другой разработчик, делающий ревью разве что :-/

Есть такое понятие QuickCheck, о котором упомянул @mr_mig_by. Вы можете описать правила, по которым сгенерируются тестовые данные

.@jsunderhood но в javascript пока до этого далеко

А вы пишете параметризованные тесты? Как вы это делаете: parameters.forEach()? А пробовали хранить параметры не в коде, а загружать снаружи?

ProTip: у beforeEach, afterEach и it блоков общий this. Можно не объявлять много разных var, а писать this.component = new TestComponent()

И еще есть вот такая интересная библиотека github.com/rluba/hamjest Смотрите какую сложную проверку можно написать: pic.twitter.com/7b0GmElG9E

.@jsunderhood и в результате вы получите компактное, но понятное сообщение об ошибке. pic.twitter.com/VWCIQpsUVE

@jsunderhood все это вдохновлено java-библиотекой Hamcrest: github.com/hamcrest/JavaH…

@jsunderhood а что плохого в кукумбер?

.@svdmitrij Он хороший, я им пользовался: github.com/just-boris/che… Но чаще приходится тестировать новые вещи, а не 10 раз тестить то же самое

@jsunderhood видели/пробовали мой wallabyjs.com? Что думаете о самой идее выполнения только тестов затронутых изменениями кода?

.@ArtemGovorov пробовал. У меня 500 unit-тестов выполняются не больше 3 секунд, так что нет смысла. Кажется лучше оптимизировать именно это.

Доброе утро! Сегодня поговорим о Selenium. Для начала вам слово: должен ли frontend-разработчик писать e2e тесты?

.@jsunderhood я пишу. Я знаю как устроен мой код и смогу оптимальнее его протестировать, чем кто-то другой

Самое страшное в Selenium – это начать. У Protractor (тестовый фреймворк для Angular.js) есть хороший гайд: angular.github.io/protractor/#/s…

.@jsunderhood еще можно почитать статью @mista_k noteskeeper.ru/1209/

.@jsunderhood в любом случае все сводится к тому, что у вас есть веб сервер, локальный или удаленный. Запросами к нему управляется браузер

.@jsunderhood хватит десятка Selenium тестов, которые пройдут прокликают страницы и убедятся, что у вас вообще js подключился и завелся

Как и полагается в Javascript, существует несколько почти одинаковых библиотек для работы в webdriver. Выбирайте любую, кроме стандартной.

@jsunderhood стандартная – это вот: code.google.com/p/selenium/wik… не обновляется и с неудобным API

.@jsunderhood альтернативы webdriver.io github.com/admc/wd. Я пользусь github.com/groupon/webdri…, у него синхронное API

@jsunderhood Я вообще не верю в отдельных QA как профессию. Тестирование это часть работы разработчика.

.@achempion это проблема. Ruby похож на Coffeescript, а его здесь не любят. Вот бы кто-нибудь сделал порт на js, как с Cucumber

Когда selenium включен, можно писать тесты. Вытащил из кода небольшой пример: gist.github.com/just-boris/6dd…

.@jsunderhood В этом примере куча проблем, дальше я покажу как их исправить. Во первых, нужно убрать от повторение строки '.search__input'

.@jsunderhood можно по-разному избавиться от таких магических констант. Чтобы каждый раз не писать css-селекторы их оборачивают в PageObject

@jsunderhood Вы создаете объект, свойства которого ведут на важные элементы вашей страницы: gist.github.com/just-boris/c4c…

@jsunderhood а потом в тестах используете эти константы. И все селекторы окажутся собраны в одном месте и их легко править

@jsunderhood почитать об этом больше можно на сайте самого selenium: code.google.com/p/selenium/wik… или погуглить "PageObject pattern"

Грубо говоря, PageObject – это просто JSON c маппингом имен на css-селекторы. Поэтому специальный framework не нужен twitter.com/DevArtem/statu…

@jsunderhood вопрос пропал :( Меня спросили примеры PageObject для асинхронного JS

Я выскажу непопулярное мнение, но асинхронные тесты это плохо. webdriver-http-sync лучше webdriver.io.

.@jsunderhood Синхронный код легче читать, в нем легче отловить ошибки. В тестах (именно здесь) асинхронность не дает ничего, одни минусы

.@jsunderhood в нашей команде разработали библиотеку на эту тему: github.com/yandex-qatools… но она на java. Мы только начинаем вступать в js

Отдельный большой вопрос как отлаживать тесты. Unit тесты легко, как обычно в devtools, а что делать с e2e? Поделитесь решениями

.@jsunderhood проблема в том, что в e2e тестах код трогать нельзя, можно только смотреть результат. А какой результат работы браузера?

.@jsunderhood Это скриншот. Поэтому selenium тестах их снимается очень много. Только мало тестовых фреймворков дают удобный механизм

@jsunderhood Автор Protactor, например, считает, что это не его задача: angular.github.io/protractor/#/d…

@jsunderhood завтра я расскажу, как легко снимать пачками скриншоты с браузера, и потом не запутаться, что они означают.

Дежурный вечерний ProTip: github.com/minimaxir/big-… Список строк, которые должен принимать ваш код. Длинные, короткие, спецсимволы - все есть

Доброе утро! Сегодня я расскажу об одном необычном тест-репортере. Обычно результат тестов выглядит так pic.twitter.com/Y7mHL5oQ1f

.@jsunderhood а может выглядеть вот так. Это Allure-framework. Система репортов, котороу я разрабатываю для компании pic.twitter.com/PyuFAmIfup

@jsunderhood А зачем? По мне red/green как в гитхабе в пул реквестах вполне достаточно.

@jsunderhood Не очень вижу как такой интерфейс с этим поможет. Все равно в итоге стактрейсы читать.

.@freiksenet_ru во-первых,мы группируем похожие Exception в список Defects. Видимых ошибок получается меньше. Во-вторых, у нас есть Attaches

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

@jsunderhood вы вызываете где-то в коде allure.createAttachment("screenshot", data); и он прикрепляется к тек. тесту pic.twitter.com/bYNt8AYNwb

.@jsunderhood полный пример с mocha можно найти здесь: github.com/allure-example…

Вот так в Mocha можно сохранять скриншот для failed теста. Allure позаботится и подклеит его к нужному сьюту и кейсу pic.twitter.com/1aVQ5NwXEs

В Allure есть еще одна инженерная хитрость. После тестов вы получаете файлы с raw-xml. Чтобы получить отчет, надо его построить c allure-cli

.@jsunderhood это нужно, чтобы не тратить ресурсы на отчеты, которые никому не интересны (когда в них нет ошибок)

@jsunderhood Allure-cli доступен в через homebrew, ppa, архив для windows, плагины в teamcity, jenkins, bamboo: github.com/allure-framewo…

Иногда хочется детализировать свои тесты и разделить их на шаги. Заходим -> Логинимся -> Открываем страницу -> Жмем на кнопку

.@jsunderhood в Allure для этого есть понятие Steps. Определяем step-функцию через наше API pic.twitter.com/0CHPzrjr1k

@jsunderhood и получаем в репорте лог по шагам в терминах тестируемого приложения, как от ручного тестировщика pic.twitter.com/x23P1QKQqI

О чем рассказать завтра? Сейчас самое время предложить тему. Можем обсудить стек karma+phantomjs и альтернативы. Кто-нибудь его использует?

Кстати, сам Allure – это SPA-приложение на Angular + Bootstrap + Angular-UI. К коду написан пак тестов на Jasmine

ProTip: можно писать ассерты в beforeEach. Если там будет exception, то mocha не исполнит остальные тесты из этого describe. Экономит время

Также в правильном коде тестов есть разница в ошибках: Exception – это ошибка в коде тестов, а AssertionError – в коде приложения.

"undefined is not a function" это Exception. В хороших тестах так быть не должно. Для AssertionError есть npm-пакет: npmjs.com/assertion-error

@jsunderhood напрямую им пользоваться не стоит, его использует, например, chai. Можно писать и свои библиотеки

@jsunderhood Allure отличает эти два вида ошибок и по-разному их обрабатывает. Это позволяет сэкономить время на поиск проблемы.

@jsunderhood Мы используем. Это property-based testing называется.

.@arik0n а можно тогда пример?

Привет. А сегодня давайте поговорим о karma. Изначально tool назывался Testacular. Потом они переименовались из-за неприличных ассоциаций

.@jsunderhood это инструмент для запуска кода в браузере. Вы даете ему файлы с кодом, подключаете launcher-plugin, и смотрите результат

Типичное использование: phantomjs+karma в режиме watch следит за файлами и запускает тесты на их изменение. Потом тесты в travis на Firefox

.@jsunderhood у karma очень гибкая архитектура и много. Это адаптеры под фреймворки, препроцессоры кода и репортеры

.@jsunderhood в команде разработчиков есть наш @maksimrv, который активно продвигал ее в русскоязычном сообществе

Со связкой karma+phantomjs много проблем. Phantom периодически умирает, нельзя зайти в devtools, отладка только через console.log

@jsunderhood 1.X - древний Webkit. DevTools имеются :-) У нас большие надежды на 2 (и уже 3) версию.

.@Vitalliumm про 2 версию эпичный баг: github.com/ariya/phantomj… JS-разработчики не в состоянии собрать себе Phantom из исходников

.@Vitalliumm а какие планы на будущее? Все вокруг уже хотят ES6, который уже есть в Chrome, Firefoх и Node

@jsunderhood да, но мы нашли в чем проблема. И уже есть фикс.

@jsunderhood пилим версию с Chromium под капотом (и full интеграцией с Node.js). FF даже не рассматривали, так как нет опыта.

.@Vitalliumm то есть архитектура похожая на Electron. А в чем отличия?

@jsunderhood да, похожая. Самым главным отличием будет headless режим и много новых API, которые мы не смогли реализовать с текущей arch.

В качестве альтернативы можно посмотреть на github.com/segmentio/nigh… это обертка вокруг Electron

@jsunderhood вот кстати да. Из-за его неучастия (он участвует, но не особо), мы не делаем кардинальных изменений, а очень хочется.

Electron оказался намного популярнее node-webkit. На нем можно делать не только desktop-приложения, но и небольшие инструменты

Например, github.com/Jam3/hihat – это devtools без браузера. Удобно для запуска мелких тестов

Кроме поиска headless браузеров, есть и другое решение – а что, если попытаться сэмулировать браузер в node.js?

.@jsunderhood на эту тему куча решений github.com/tmpvar/jsdom github.com/krasimir/atomus github.com/cheeriojs/chee… у всех свои отличия

@jsunderhood Zombie.js?

Я пользуюсь JSDOM. Настройку подсмотрел здесь: github.com/thejameskyle/m…

.@jsunderhood с Webpack и Browserify стало популярно писать браузерный код в node.js стиле. Удобно, что его стало можно тестировать в node

У меня был проект с небольшим паком из 50 тестов. В Karma они прогонялись за ~5 cек, с учетом запуска. В node+jsdom все проходит за 200ms

.@jsunderhood экономия на препроцессинге и trade-off на общение с браузером дает значительный выигрыш в скорости

@jsunderhood это все справедливо для только функциональных тестов. Для проверки стилей лучше скриншоты и Selenium.

Сheerio тоже хорошее решение, но это эмуляция jQuery для node, а не полного DOM API. Для React и Backbone этого недостаточно

.@jsunderhood возможно сейчас на волне развития изоморфного (универсального) javascript появятся еще решения. Может вы их уже знаете?

Еще когда мигрировал с karma на jsdom наступил на интересные грабли. Модули в node.js кэшируются, поэтому запуск на watch получал старый код

.@jsunderhood можно делать всякие хаки с require.cache, а можно просто каждый раз запускать тесты в новом процессе pic.twitter.com/aafCV4eeUG

.@jsunderhood таким образом мы получаем на каждый старт чистое окружение. Karma делает аналогично она запускает новые тесты в iframe

@jsunderhood есть опыт использования nightmare 2.x? Месяц назад не смог завести, использую 1.8.x, она на phantomjs. Работает стабильно

ProTip: в lodash можно подменить Date, чтобы заставить _.debounce сработать раньше. Это ускорит тесты с его участием pic.twitter.com/RNxGYP2lyE

TestLikeAPro: у Jasmine есть свой fake-server: jasmine.github.io/edge/ajax.html когда у вас проект на Jasmine, вам Sinon не нужен совсем

@jsunderhood условно да, конечный вариант который я пушу, это пропись версии браузера в дев депах проекта

Доброе утро! Давайте сегодня поговорим про взаимодействие с backend. Так получилось, моя команда состоит из 5 джавистов и frontend

Allure изначально разрабатывался под java-тесты. Адаптация под остальные языки пришла позже. Поэтому core проекта собирается maven

.@jsunderhood собирать frontend maven-ом не такая боль, как может показаться. Есть все необходимые плагины.

@jsunderhood господи, вот я и услышал фразу "собирать фронтэнд maven'ом"

@safinalexey @jsunderhood И сейчас можно)) просто запускалка тасков github.com/eirslett/front…

Webjars – bower для java: webjars.org

@jsunderhood есть еще bitbucket.org/cofarrell/bowe… но он так и не смог установить все что мне нужно

SASS собирать легко, потому что он написан на Ruby. Подключаем jruby и все работает. Less работает через Rhino

А вот с упаковкой js все плохо: есть только wro4j без поддержки SourceMaps Из-за этого скрипты в Allure остаются неупакованными

@jsunderhood плагины - аналоги из npm или те же самые, но крутятся в rhino?

.@agudulin нет я говорю об имплементациях на java

.@agudulin особого смысла запускать что-то в Rhino нет. Сила js-инструментов не в языке, а в большом количестве модулей из NPM

@jsunderhood @alexeyraspopov ну так ты можешь использовать ванилу, или любую модульную систему или сбилдить в UMD и стянуть это через npm.

В комментариях хоронят Bower. Для профессиональных js-разработчиков он действительно уже не нужен.

.@jsunderhood но иногда бэкенд-разработчики хотят сверстать что-то маленькое. Они не хотят настраивать сборку, они Bower как раз для них

@jsunderhood @iamstarkov @m_arzubov если люди способны написать
bower install N
не будет сложно написать и
browserify index.js > bundle.js

.@alexeyraspopov @iamstarkov @m_arzubov написать один раз несложно. Проблемно настроить автоматическую сборку вместе с backend-кодом

@alexeyraspopov @jsunderhood а как же разделение библиотек нужных для сборки например и тех, которые уйдут на фронтенд?

.@SilentImp @alexeyraspopov я кладу библиотеки для frontend в dependencies, а те что для сборки – в devDependencies

Вот еще тема для обсуждения: Не кажется ли вам, что сахар из ES6 может превратить язык в Perl, которого все боятся из-за нечитаемости

@jsunderhood например, вот такой код из примеров Redux с первого раза сложно понять pic.twitter.com/ERFFozstoq

@jsunderhood Все что угодно может быть превращено в Perl, если вовремя не бить по рукам (себе в первую очередь).

@freiksenet_ru @jsunderhood Это просто currying, как в любом функциональном языке. Если знаешь паттерн, даже не думаешь про это.

@dan_abramov @jsunderhood Если разбить по строкам то читатся будет гораздо лучше ;) Проблема не в карринге, а в том как это написано.

@jsunderhood сложность этого кода — проблема Redux, не ES6.

@jsunderhood привыкнем) а самому писать можно и без сахара, если страшно

@alexeyraspopov @jsunderhood @dan_abramov @freiksenet_ru Но да, в мире JS это единственное каррирование, которое есть, пусть и ограниченное.

@RReverser @jsunderhood @dan_abramov @freiksenet_ru полно нормальных имплементаций. Свое решение пишется также легко pic.twitter.com/RHSJlJT0T4

@jsunderhood Тем более, такое API позволяет легко делать и сохранять в замыканиях общие инициализации на любом шаге.

@jsunderhood Это часто бывает нужно, и обычное каррирование такой возможности не дает.

@jsunderhood @RReverser ИМХО в #redux апи не большое, но понимание сложнее вот именно из-за этого функция->функция->… Сложнее цепочку разоб

@jsunderhood А что документировать? В твоем скрине инициализация не нужна, в другом будет нужна. Все дело в гибкости, чтобы покрыть оба.

.@RReverser сейчас не понятно, какая из функций вызовется один раз, а какая на каждый action. Если это описать, то станет лучше @dan_abramov

@serhey_shmyg @jsunderhood Воспринимай это как упрощенный вид джавоподобной цепочки классов. К этому быстро привыкнуть и удобнее.

@jsunderhood @dan_abramov А по-моему, наоборот, понятнее - та что непосредственно с аргументом action, та и на каждый, те что без - 1 раз.

@jsunderhood @dan_abramov Но да, описать можно, чтобы люди не терялись.

@jsunderhood главная причина нечитаемости перла это неявные переменные (всякие $_, @_, $&). В js пока ничего подобного вроде не наблюдается.

Расскажите, что сегодня случилось с PhantomJS? Вижу много знакомых людей в тикете: github.com/Medium/phantom…

@jsunderhood битбакет лежал

Полная история такая. Есть karma-phantomjs-launcher c peerDependency npmjs.org/phantomjs. Этот модуль скачивает phantomjs при install

@jsunderhood этот модуль отличный пример как модули делать не надо. Он завязывается на чужую инфраструктуру, а значит ненадежный

.@jsunderhood для себя я давно сделал заглушку github.com/just-boris/pha… которая отдает phantomjs установленный в системе. Работает с 2.0 тоже

@jsunderhood еще вариант: github.com/eugeneware/pha… этот npm модуль хранит phantom внутри себя. Работает всегда, когда жив NPM (и весит 90Мб)

По пятницам приходит рассылка javascriptweekly.com. Всегда есть что-то интересное. В этом выпуске рассказали про rollupjs.org

@jsunderhood Rollup.js сборщик модулей, который умеет выкидывать части модулей, которые не используются. В Webpack2 будет так же.

ProTip: Пользуйтесь скриптами pretest и posttest вместо того, чтобы писать в одну строку через && pic.twitter.com/JEfbnmIhyB

Завтра суббота, выходной, поговорим на свободную тему, отвечу на ваши вопросы. Доброй ночи!

@jsunderhood тоже советую эту рассылку, помогает быть в тренде и понимать что вообще творится в мире :)

Давайте сегодня поговорим про взаимодействие с бэкендом. Нужно ли вообще общаться словами или документации по API достаточно?

@jsunderhood поэтому общение важно, чтобы приходить к одному решению. Да, и еще не надо забывать что могут быть еще мобайлы

Нашей команде повезло, и front и server-side разработчики сидят в петербургском офисе. Это позволяет оперативно решать разногласия

Еще я стараюсь вникнуть в суть проблемы, когда джавист говорит, что не может добавить новое поле в ответ API.

.@jsunderhood часто это признак, что вас расхождения в структуре, а модели клиента не матчатся на модели сервера.Лучше узнать об этом раньше

@jsunderhood Мы даже сидим в одной комнате (команда небольшая).

.@Rukomoynikov а как устроен процесс? Back и Front пилят в своих ветках или все сразу в master?

@jsunderhood Мы только в свою, ребята из Back и в нашу тоже вливают новое API. Да, ветки отдельные. И у нас тоже Java.

Еще сервер очень часто возвращает огромную модель, даже если от нее нужно три поля. Это решается в GraphQL+Relay, но что делать остальным?

@jsunderhood jsonapi.org в помощь ))
вот тут jsonapi.org/examples/ во втором примере показано как брать только то что нужно

В Twitter появилась возможность создавать опросы. Давайте узнаем ваше коллективное мнение

@jsunderhood Создай вопрос на табы vs пробелы, давно пора :)

.@RReverser пробелы, о чем тут еще говорить

@jsunderhood Потому и надо опрос, здесь периодически поднимается (напр. я за табы), но реплаи не так удобно :)

Давайте узнаем!

@RReverser в чем плюсы веб-версии перед тем, что на twitter.com? @jsunderhood

@fuckingsun @jsunderhood Для меня основной плюс - табы под юзеров/сообщения/хештеги, удобно когда все на одном экране.

@RReverser спасибо за обзор, пойду затестирую. знаете какие-нибудь ещё веб-сервисы для чтения твиттора? @jsunderhood

К опросу можно добавить только 2 варианта ответа. Поэтому, устроить голосование за лучший js-фреймворк не получится

@jsunderhood можно каждый написать и спрашивать: за или против

@jsunderhood Придётся делать много опросов с двумя вариантами, а потом опросы с победителями и т. д. ;-)

О Twitter! Место, где ты ограничен во всем: в числе символов, опций в опросе. Но я сейчас что-нибудь придумаю

Какие вообще есть кандидаты? Я знаю Angular, Backbone+Marionette, Ember, React

.@dcromster так-то можно и в контакте опрос сделать. Интересно как это оформить не покидая twitter

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

Angular. Allure написан на версии 1.3. Плюсы – простота, к нам пришло много внешних контрибьюторов, которые легко делали нам фичи

@jsunderhood например, нам добавили поддержку i18n и переводы на русский и португальский с нашим минимальным участием

Backbone+Marionette. Хорошее комбо, его любят джависты, поскольку там тоже все на классах. Сейчас пишем на нем дополнение к Allure

Ember.js Написал на нем небольшой hello world, но активно нигде не использую. Опасаюсь, что для него меньше плагинов, чем у других

React. Изучаю его в рамках небольшого проекта на github: github.com/just-boris/rev… Регулярно спотыкаюсь о странные вещи, но в целом норм

@jsunderhood например, я не вызывались JSX-компоненты. Как об этом спросить в сети: "Парни у меня html-тег не вызывается?"

@jsunderhood ember addons - очень удобные. Легко подключать и испольозовать. Плюс есть рейтинг аддонов.
==> emberaddons.com

@jsunderhood вечером посчитаю и опубликую результат

@jsunderhood лично я использовал аддон от Semantic.
emberobserver.com/addons/semanti…
github.com/Semantic-Org/S…

Итак, мы узнали, что есть много UI-компонентов для Ember. А как обстоят дела с этим у React?

@jsunderhood react.parts

@jsunderhood react-components.com например. Но есть приколы типа jQuery плагинов, завернутых в реакт-компоненты.

@jsunderhood а вот для реакта. Кстати толкового меньше готового. говнецо в основном как для jquery

.@Bardty @iamstarkov а github.com/react-bootstra… пробовали? Плюс Bootstrap в том, что он дает сразу много компонентов в одном стиле

@blia @jsunderhood @Bardty @iamstarkov для реакте есть же material-ui.com

@jsunderhood Пользуюсь им, очень нравится. Они полность переписали JS Бутстрапа. Но все проблемы CSS остались. @Bardty @iamstarkov

@jsunderhood а как же meteor, knockout, riot, vue, derby, circle и миллионы других фраемворков. Этот опрос изначально не имеет смысла.

.@hellbeast92 они не такие популярные. Но если в них есть какие-то особые достоинства, можно о них рассказать

Еще есть aurelia.io Этот фреймворк разрабатывает человек из Angular, сбежавший от ада TypeScript в версии 2.0

@jsunderhood в организации на Gihtub у них настоящая секта с однотипными аватарками pic.twitter.com/YXOI8I3TOY

@jsunderhood а что не так с TypeScript?

.@dmitryshimkin c самим TypeScript все норм. А вот толстый слой абстракций, написанных на нем в Angular 2.0 это не ок

@jsunderhood @dmitryshimkin я бы сказал наоборот, Angular 2 это то, что я ждал очень давно.

.@Vitalliumm @dmitryshimkin а какие в нем преимущества?

@jsunderhood @dmitryshimkin если в общем, они учли ошибки и косяки 1 версии, и ликвидровали их во 2 (например, наследование скоупов)

.@Vitalliumm с этим соглашусь. Но в то же время наделали новых, усложнив архитектуру. Я уже видел этот подход в ExtJS и где он сейчас?

Результаты голосования
Angular - 4 stars
Backbone - 1 star
Ember - 4 stars
React - 19 stars.
С победителем все ясно

А что произойдет через год или два? Останется ли React так же в топе, или появится новый, кто "решит все наши проблемы лучше предыдущих"?

@jsunderhood тут могут быть два варианта развития событий: либо ФП становится необходимым минимум для js-dev, либо остается уделом немногих

В этом отношении мне нравится Backbone. Ему уже 5 лет, а он все еще актуален

@jsunderhood не. 2 года - это как раз итерация для фронтенда. Будет что-то новое популярно. Всегда так было.

@jsunderhood Backbone хорош тем что его можно юзать не только для SPA.

@blia Реакту уже больше двух лет. @jsunderhood

.@sapegin да, я пробовал 2 года назад и попробовал сейчас. Изменилось многое. Даже не сам react, а его окружение типа redux

@jsunderhood BB как jQuery. Он будет еще долго актуален за счет аддонов и сравнительно низкого порога входа.

ProTip: подпишитесь на рассылку вопросов со stackoverflow по тегу ES6 и вы будете получать ответы на вопросы, которые у вас будут в будущем

@jsunderhood а есть инфа, насколько фп сейчас распространено среди фронтендщиков?

@iamstarkov @jsunderhood @mr_mig_by google.com/trends/explore…

@jsunderhood отн.интерес в сентябре 2015:
react js - 96, flux js - 8, redux js - 6, prototypal inheritance - 2 pic.twitter.com/KI7x3plar6

@jsunderhood medium.com/@zackargyle/st…

@fuckingsun @jsunderhood с этой статьи надо начинать изучать react.

Привет! Сегодня будет встреча SPB Frontend про React. Потранслирую, если будет что-то интересное

.@jsunderhood пока для погружения в контекст почитаю статью: teropa.info/blog/2015/09/1…

@jsunderhood &Co,посоветуйте i18n либу для Browser/Node, чтобы просто,удобно, .po умела и числительные (pluralization), и домены желательно.

.@KSDaemon подойдет? formatjs.io

Еще вчера мы затронули интересную тему готовых UI-kit. Есть два фаворита: Bootstrap и Material-UI. Есть еще варианты?

.@jsunderhood еще пробовал semantic-ui.com, но у них тоже имена классов не по БЭМ, это может привести к проблемам в будущем

@jsunderhood getuikit.com

.@jsunderhood bem-components можно просто подключить как css и js с CDN Яндекса. Так я их интегрировал с Backbone: jsfiddle.net/z1cLLt4w/14/

Из других UI-kits с БЭМ-классами знаю еще topcoat.io

Использовать UI-kit без БЭМ-классов сложно. Свои стили хочется писать по БЭМ, и в проекте получается смесь французского с нижегородским

Сегодня и @jsunderhood, и @cssunderhood обещают быть на митапе @spb_frontend. Осталось 40 минут, кстати.

@jsunderhood foundation живой еще?

.@Bardty живой, и кто-то даже пользуется (не я)

Таблица сравнения всех flux-фреймворков, но используйте Redux docs.google.com/spreadsheets/d…

Говорят, тестировать в node лучше чем с Karma. Я в четверг говорил о том же pic.twitter.com/TMFZkqIsMB

У @andreypopp забавные слайды под углом. Удобно снимать с моего места pic.twitter.com/q4kVoIIGDR

CSS-модули обфусцируют имена классов. Не забудьте оставить метки по которым смогут кликать selenium-тесты, если они есть

Redux появился как маленький пример для доклада @dan_abramov про Hot Reload — к вопросу о том, зачем нужно выступать на конференциях

Знакомьтесь — это redux pic.twitter.com/qqrhQXiMlm

Стоит заметить, что у 2 из 3 докладчиков были слайды на английском. Вот такого уровня митапы устраивает @spb_frontend

ProTip: поставьте себе f.lux: justgetflux.com это приложение подстраивает яркость монитора под время суток. Это полезно для глаз

@jsunderhood да, и это хорошо, тоже пользую 👍

@jsunderhood, getstandapp.com @fuckingsun

@jsunderhood я себе поставила pace — остальные уродливые были( itunes.apple.com/ru/app/pace/id…

@jsunderhood @boriscoder опубликовал архив jsunderhood.ru/boriscoder/

Ну вот и все. С вами был @boriscoder, на Github записан как github.com/just-boris. Я продолжу писать свои protips уже в своем профиле

Спасибо вам, что приняли участие. Вы хорошая и интересная публика! coub.com/view/8gdgx