- Meguro.es #17に参加してきました。
- 初参加でしたが幅広い分野で初めて知ることも多く勉強になりました！
- さっそく試してみたいと思える話もありとても有意義でした！
| タイトル | 発表者 |
|---|---|
| 10分でわかるReact fire | kdnk |
| ゼロから学ぶWeb Authentication API | kobayang |
| React.js の render-props と Function as child の紹介 | mori-dev |
| Caching Data Apollo Client | takanori_oki_9 |
| DoczをPJに入れてみた | mki_skt |
| Diagnoses your Node.js app (intro) | darai0512 |
- 以下メモ書きです
10分でわかるReact
- firekdnkさん
React Fire
背景
- ReactDOMの近代化
- Reactv17に入る???
- issue#13525
概要
- 新機能というよりは既存機能をよりわかりやすくするもの
- nativeの挙動に合わせることで思わぬバグを減らす
input value
- inputのvalue属性に反映させるのをやめる
- propertyとattrは違う
- propはjs
- attrはhtml
attach events
- イベントをdocumentじゃなくてReactのRootにattachするようにする
onChange -> onInput
- onChangeをやめてonInputに変える
- 理想的にはevent.targetを使いたくない
イベントシステムをシンプルに
- 独自のイベントシステムをDOMのイベントに近づける
- イベント周りで不要なものが入ってるからReactDOMのバンドルサイズが大きい
className -> class
- classNameがclassに変わる
ゼロから学ぶWeb Authentication API
- kobayangさん
Motivation
Web Authentication API
- Credential Management APIの拡張
Credential Management API
- ログインフローをシンプルにするAPI
処理の流れ
Registration Phase
- navigator.credentials.store
- 引数で渡した認証情報を保存する
Authentication Phase
- navigator.credentials.get
- 保存した情報を取得する
Web Authentication APIに仕組み
- Authnticatorを呼んで暗号鍵認証できる
参考記事
React.js の render-props と Function as child の紹介
- mori-devさん
きっかけ
- HOCを使っていた
- render-propsを使うともっと良いというブログを読んだ
親から子へコンポーネントを渡す
- jsxタグの属性で渡す
- 文字列でもオブジェクトでも関数でも渡せる
- コンポーネントを返す関数も渡せる
- コンポーネントそのものも渡せる
- childrenという属性名だ渡す場合は
<Child children={xxx} />と<Child>{xxx}</Child>が同じ
Caching Data Apollo Client
- takanori_oki_9さん
Apollo Client
Apollo Link
- Client - Link(URLセット) - Link(Tokenセット) - Server
- Linkはミドルウェアみたいなもの
apollo-cache-inmemory
- ApolloClientデフォルトのキャッシュ
- ReduxのStore的な
- APIをアグリゲートするところでReduxのStore使わなくて良くなる
InMemoryCache
- アクセスするときはGraphQLのクエリを投げる
- ローカルのキャッシュを柔軟にいじれて便利
- オフライン対応で役立つ
DoczをPJに入れてみた
- mki_sktさん
Doczとは
- コンポーネントガイド
- storybookみたいな
- ゼロコンフィグ
- mdxにも対応
Docz導入
上手くいかなかったこと
まとめ
- コンポーネントガイドだけほしいなら選択肢としてあり
- ShapshotTestとかしたいならStorybookで
Diagnoses your Node.js app (intro)
- darai0512さん
Node Summit 2018
- サンフランシスコ
- $660
- 3日間
- 1000人くらい(うち日本人6人)
- nodeのコミッターがたくさん参加してる
Diagnose
- Monitoring
- モニタリングして問題を察知
- Profiling
- プロファイリングをとる
- Tracing
- stack-trace
- AsyncHooks
- プラットフォームに非依存なv8トレーシングを目指してる
