note(旧)5万人に1人になる。この広告は、90日以上更新していないブログに表示しています。Reduxこれに行ってきたのでそのメモ。#4ReactですよまさかSPAを語り尽くす会から引き続いてこちらも抽選当たるとは思ってなかったけれどラッキーなことに当たったので行ってきました。全力でメモしてきました。残しといたメモを貼りつつ感想を付け加えていくスタイルで。Graphというデータ形式でCacheを構築する。Graphは参照をクラサバで共有するための仕組み。FalcorFalcorはviewには依存していない(modelのみを担当する)。componentDidMountでmodelを監視するイベントを設置するみたいなやり方がある。libraryを用いて負荷の低減は可能)ほんとにDDAは必要か?向いてるやつ複数のクライアントを考えてる通信料を絞り込みたいデータ構造に多対多が頻出する向いてないやつデスクトップメイン自社のクライアントから呼べれば良い木構造が扱えれば十分なものまとめDDAがほんとに必要かはしっかり考えてからGraphQLやFalcorを導入すべき感想GraphQLとFalcorに関しては、Relayを初めて知ったときに触ってはみたものの、そのときに使ったサンプルが全く動かせず、解決できずで断念した記憶があった。そこからちょいちょい名前は聞いていたが全然深堀りせずに今に至るわけだが今日話を聞いた限りだと上手くはまれば便利にはなりそうだが、それがはまるパターンがそんなに多くなさそうっていう印象。クライアントで気持ち良くなるためにGraphQLをやりたいがためにサーバーで頑張ったりクラサバ間にまた一個レイヤー作ったりとか、涙を流さずにはいられない努力が必要になりそう。属人性が高くならないようにするfluxのデータフロードメイン、ロジックはどこに書くかドメインモデルはどこにいるか?(データとふるまいをもったclass)fluxの見方をかえるドメインモデルを作る目的は切り分けfluxの曖昧なところドメインレイヤーが曖昧ショッピングカートの例storeが曖昧になる。CartStore)。CartStoreからカートのstateをとれる。CartStoreはProductStoreに依存している。storeは独立させると問題がおきる。アクターがシステムに対して何をしたいのか)モデル自身は自分の永続化に関心がないってのが良い方法Repositoryがドメインモデルのインスタンスを永続化する情報量が多すぎてここらへんからメモを取ることを諦めたのであとは資料を読んでくれれば。いうか本当に深い内容なので是非ちゃんとみんな読んでほしい。凄まじい情報量でした。これはあとでじっくり全部の資料読み込んで実践しなきゃってなるやつでした。早く帰ってやりてえって気持ちがとても高まった。これだけでも本当に来てよかったと思う内容でした。実行環境effectを使って処理を書く。rauntimeの中でeffectを実行する。redux-logic???redux-logicとはmiddlewareを構造化してくれる、内部はRxJS副作用コードをvalidate,transform,processの3つに分けるサービスがDIされるのでテストは比較的しやすい(モックは避けられない...?)まあ他にも今さらに色々出てきているよ。まとめmiddleware戦争は収束の見込み無しなので、本当に必要なものを見極めて使っていくべき。Reduxのアプリケーションを業務で書いていてそこでredux-sagaを使っているので、うんうん言いながら聞いていたが、確かにredux-sagaはgeneratorとかyeildとか使ってるし、while(true)とかやっちゃったりするし、初見だと相当気持ち悪さを感じるかもしれないけれど、ここまで責務を分けていると本当にどこに何を書くべきかがわかりやすくてとてもやりやすい、と思っている。middlewareの話を追いかけていなかったけれど、そんな間にまた相当でてきたみたい。そっちも今度試してみよう。React2@mizchiさんqiita.com内容いかにReactをふつうのwebアプリに導入していくかという話。loaded(importした時点で副作用が発生するようなモジュールが多い。関数を返すべきである)なんかよくするモダンな開発環境を導入する再利用するコードとできないコードを分別する失敗。最終的に今は最初に失敗したQiitaの編集画面のリファクタに戻ってきた。5周年記念イベントで話してたのと同じやつだあと思ってたら本当に同じやつだった。そのときから内容がアップデートされていた。@mizchiさんほどのエンジニアでも失敗を繰り返して泥臭く奮闘をしているその圧倒的現実感に胸を打たれつつ、こういう夢物語ではないReact話をもっと聞いて勇気をもらいたいとそう思ったのでした。Qiitaとかでも仕様書なしに進めていくんだなあ...しみじみ。これ以降はピザ食べながらのLTタイム。ピザ食べてたのでメモできなかったり中途半端だったりするけれどご了承ください。ReactコンポーネントとCSSコンポーネントは1対1なのか問題について@shibe97さん内容1対1派の話。以前は1対1ではない派だった。ComponentはCSSのまとまり。CSSはHTMLに紐づく。1対1browserify/webpackによって分割ができるようになったため、CSSと同じ粒度に揃えることができる。極端な話、DOMの一つ一つがcomponentになりうる。design)でComponent化。現実的には工数の問題もあるので、徐々にComponent化していく。Componentと粒度は揃うまとめReactとCSSのコンポーネントの粒度は揃うComponentは細分化するに越したことはないが工数とのトレードオフ感想ここ最近でわりと熱い話題。この話題になるといつも言っちゃうけど、僕は以前にこの記事を見てから完全にそれに共感してしまっている立場。morishitter.hatenablog.comしかしスライドを見ていて、理想論をつきつめると確かにそうだなあーと同意できる話だった。JSは現状はしないで実装していくかなあーっていう。無理というのは工数的な話なので趣味開発では@shibe97さんの言うやり方でやってみたいなと思った。Kurosawa内容reactアプリケーションのアクセス解析についてreact-gaとかのComponentがいまいち従来通りheaderに埋め込むのか?Componentを使うのか?結局Componentもscriptタグがappendchildされる。初期化タイミングが遅くなる。reactアプリ外からsendするときはだめ。routingポイントでsendする(react-routerとか)react-router-reduxのreadmeでhistory.listenってのがあるけど...pathnameってのがコールバックに渡ってくるけれど、それだとURLにIDが入っちゃって同一ページでもばらけてよくわからない。pathという情報がとても有用。僕はまだSPAやってるときにGAを使う状況になってなかったので全く未経験の話だったがこれは覚えておくとあとあととても役に立ちそうだなと思った。※ピザに夢中でしたすみません。感想1ページ1コンポーネントで運用しているという話には「なん...だと...」っていう感想を持った。Jest@cpojerさん資料は見つからないので見つかり次第載せます。(多分見つからない)内容Jestというテストフレームワークの話。英語聞き取れません...。僕がわかったのはこの程度です...。良さそうというのはわかった。painlessとはなんとも素敵な響き。その前にクライアントのテストを書いてないのでまず僕はそこからしっかりやらねばならない。テスト書くぞ!まとめとても熱い一日だった。@azu_reさんのスライドはとても気合が入るというかモチベーション上がる話だったのでしっかり資料読み込んで学ぼうという気持ちになった。なんかもはやReactの話が前のように「Reactはいいぞ」一辺倒ではなくてしっかり現実と戦う感じの話が多くなってきたのが聞いていてためになる感じで良い。@mizchiさんの話とかは今年頭からのアップデートって感じで1年を感じられた気がしたのもまたおつでした。ピザがひたすらおいしかった。ピザがくると話を聞く力が1/5くらいになっちゃうのがちょっと困ってしまう。deckの方が使われてる。そんでその上をいくのがHTMLベースで自分のサーバーに置くパターンだった。pagesとかで管理していきたい。@mizchiさんはQiitaスライドだった。Qiitaスライドはこれからどんどん増えていきそうな気配。あーでもスライドだとフォントサイズで困っちゃうっていうパターンを何度か見てるからそこはネックかもしれない。今日は熱い一日だったので明日からも頑張っていこう。その前にペルソナ5を終わらせたい。こちらからは以上です。@...これに行ってきたのでそのメモ。ここのところ僕は仕事でReactばっか...2016-08-28『君の名は。