Архив недели @andreypopp
Понедельник
Привет! На этой неделе с вами @andreypopp. Занимаюсь разработкой на JS/Python. С недавнего времени живу в Санкт-Петербурге.
Давайте поговорим о ФП в разработке интерфейсов. От концептов и языков программирования до библиотек и фрэймворков.
FRP: все о нём говорят, но мне до сих пор непонятна его ценность, хотя очень интересно. Кто-нибудь расскажет?
PureScript интересен тем, что позволяет судить об “эффектах” в приложении. Например: “пусть эта функция не пишет в DOM”, “тут нет I/O"
React: "опиши UI один раз как функцию от данных, не надо описывать миллион способов изменить UI при изменении данных”
Пришел в JS только после появления React.js. Кроме JS и Python применял на практике Erlang и Scala. Пробовал ещё много функциональщины...
Из интересного для меня на эту тему: Immediate mode UI (React, …), стат. типизация (PureScript, OCaml, …), FRP.
К сожалению не знаю такой. Были бы добровольцы перевести офиц. документацию… Перевод на китайский идет полным ходом. twitter.com/pvlpvs/status/…
Разговор про Elm: Да, но у того же PureScript система типов и FFI объективно лучше. Биндинги для React есть. twitter.com/aluuu/status/6…
@jsunderhood организовать перевод, например на github, и подтянутся люди :)
Согласен! Вот, как пример, PR для добавления перевода части документации на китайский. github.com/facebook/react… twitter.com/talgautb/statu…
@jsunderhood @andreypopp какой район Петербурга с твоей точки зрения лучший для жизни?
Однозначно Петроградская сторона, но у меня предвзятое мнение, я закончил ИТМО. twitter.com/listochkin/sta…
@jsunderhood как ты считаешь, откуда весь этот хайп по поводу функциональщины в js?
Не думаю что это хайп, просто функциональный подход работает twitter.com/_cloudo/status…
@jsunderhood чувствую как ФП все больше поглощает фронтэнд. Не подскажешь хорошую литературу? Сейчас сижу над ohaskell.dshevchenko.biz/ru/index.html
Хороший список книг/материалов на русском alexott.net/ru/fp/books/ от @alexott книги Харрисона неплохи twitter.com/bagadim/status…
@jsunderhood Хорошее объяснение тут gist.github.com/staltz/868e7e9… . Еще полезно глянуть этот спич youtube.com/watch?v=DqMFX9…
Действительно интересно почитать. Кстати gist от создателя cycle.js.org @andrestaltz twitter.com/__fro/status/6…
Но даже в простейших примерах FRP прослеживается главный его недостаток: необходимость учитывать время, даже там где это не нужно.
Поэтому "FRP как архитектура всего приложения" не очень хорошая идея на мой взгляд. Для анимаций, наверное, самое-то.
Хорошие абстракции должны изолировать время и асинхронность.
В React/Flux архитектуре время изолируется в хранилищах вместо того, чтобы утекать в UI. UI — отображение определенного момента времени.
Redux от @dan_abramov реализует управление состоянием лучше чем Flux: вместо изменяющегося состояния есть "рецепт как изменить состояние"
Что, кстати, уже снова близко к FRP, но есть чувство что там это оправдано: где-то время нужно учиывать. Главное делать это контролируемо.
Возможно последний твит это все-же результат моего непонимания FRP (или понимания? :-)
Следующий шаг в управлении изменяющемся состоянии это CRDT структуры данных где порядок операций значения не имеет. Прячет время ещё дальше
Тред (@andreypopp)
Кто ещё не видел есть реализация CRDT на JS (работает конечно же и в браузерах): swarmjs.github.io от @gritzko
On FRP: twitter.com/andrestaltz/st…
У нас тонкая “запускалка” поверх webpack для Jasmine спек: github.com/prometheusrese…
@jsunderhood то есть суть - делать render на каждое валидное состояние
в этом суть React twitter.com/__fro/status/6…
Вторник
@jsunderhood rauchg.com/2015/pure-ui/
Отличная статья: “UI как функция без побочных эффектов” /cc @iSnifer есть примеры к нашей недавней дискуссии twitter.com/AndryRochev/st…
Создатель @babeljs присоединяется к команде FB — хорошо когда за таким полезным проектом целая компания.
Вчера ночью чуть-чуть обсуждали REST API. Интересно, появление GraphQL/Relay и Falcor вытеснит классический REST или нет?
У нас есть своя похожая штука: HTSQL htsql.org/doc/overview.h…, более близка к полноценному языку запросов, но у нас и требования другие
This @domenic's comment just made me depressed as it looks like nothing cool will make it into ES7 :( github.com/babel/babel/is…
Коммент от участника TC39 про то почему ваши любимые фичи @babeljs не попадут в ES2016… twitter.com/RReverser/stat…
I can't do this manually anymore. If you write @reactjs libraries, feel free to use it: github.com/gaearon/librar… pic.twitter.com/HI83ce0K6f
Отличный стартер-кит (React, ESLint, Mocha, Babel, Webpack) от @dan_abramov. Но я бы заменил npm скрипты на Makefile twitter.com/dan_abramov/st…
Кто-нибудь должен сделать фрэймворк для shell скриптов, чтобы подтягивать функции с npm. Я с удовольствием буду его использовать.
"Makefile это JSX командной строки” — пока не попробуешь не поймешь в чем польза
Вот пример тонкого Makefile для JS проекта: github.com/andreypopp/aut… на мой взгляд приятнее чем npm скрипты + директория scripts/
Среда
Поэкспериментировал с темингом для React компонент github.com/andreypopp/ret… Идея: протокол для компонент, которым можно изменять внешний вид
Можно использовать с inline styles, css modules, … Как вам API? Чего не хватает?
Альтернатива: делать теминг на уровне системы модулей, так можно инжектить нужные стили статически (нужен webpack-loader какой-нибудь)
Кто еще не знаком с CSS modules github.com/css-modules/cs… компонентный подход к стилям
Подсказали классную утилиту для демок React компонент github.com/insin/react-he… — heatpack ./WidgetDemo.js
Идея: плагин для webpack который позволяет редактировать props компонент прямо в браузере. Сохраняет обратно в исходники.
Наводишь мышкой на экране на элемент и открываешь диалог с редакторов свойств. Прямо в приложении.
Для этого нужно будет аннотировать все вызовы React.createElement позицией каждого prop в исходниках
Альтернатива Chrome Workspaces от FB twitter.com/RReverser/stat…
Есть мнение что devtools должны быть не в отдельной панели UI, а частью самого приложения. //cc @dan_abramov как эксперта по DX
DX — developer experience, аналог UX.
Сейчас когда интроспекцию можно делать на уровне приложения (React, Redux) можно экспериментировать с новыми видами, интерфейсами devtools
Четверг
ESLint v1.0.0-rc-1 released: eslint.org/blog/2015/07/e… First release candidate for v1.0.0!
В сочетании с Babel-ESLint это просто замечательный инструмент. Появился 1.0-RC twitter.com/geteslint/stat…
Дискуссия про Babel и нестандартные расширения языка (JSX): reddit.com/r/javascript/c…
STAGES OF WORKING FROM HOME - Yay I get to work from home - It would be nice to talk to people - I hope that pigeon sits in the window today
Не люблю работать из дома twitter.com/MarkAgee/statu…
Пятница
var,let, orconst? I useconstfor almost everything. Rarely, I'll uselet. Nevervar. #es6 #JavaScript
Действительно, let, const или var? В es6 я использую let, так меньше набирать да и читается отлично. twitter.com/_ericelliott/s…
