Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
React非同期ライブラリを知る
Search
nitaking
September 28, 2018
180
0
Share
React非同期ライブラリを知る
rxjs redux-observableについて
nitaking
September 28, 2018
More Decks by nitaking
See All by nitaking
人は30分でLT資料を作って発表できるのか
nitaking
0
270
React Native ことはじめ
nitaking
0
270
2021-06-24 最近のビルドツール調べてみた
nitaking
0
150
Fishのススメ
nitaking
0
85
Blitz.jsの紹介
nitaking
1
1.1k
Expo WEB × Next.js は実用できるのか?
nitaking
3
1.1k
react-hooks-loggerつくった話
nitaking
0
530
あの震えるインタラクションを実装したい
nitaking
1
1.5k
アプリリリースまでのつらみあれこれ
nitaking
0
690
Featured
See All Featured
The #1 spot is gone: here's how to win anyway
tamaranovitovic
2
1k
Beyond borders and beyond the search box: How to win the global "messy middle" with AI-driven SEO
davidcarrasco
3
99
Amusing Abliteration
ianozsvald
1
150
The untapped power of vector embeddings
frankvandijk
2
1.7k
コードの90%をAIが書く世界で何が待っているのか / What awaits us in a world where 90% of the code is written by AI
rkaga
61
43k
Dealing with People You Can't Stand - Big Design 2015
cassininazir
367
27k
Unsuck your backbone
ammeep
672
58k
Balancing Empowerment & Direction
lara
5
1k
How to optimise 3,500 product descriptions for ecommerce in one day using ChatGPT
katarinadahlin
PRO
1
3.5k
Templates, Plugins, & Blocks: Oh My! Creating the theme that thinks of everything
marktimemedia
31
2.7k
How STYLIGHT went responsive
nonsquared
100
6k
Leading Effective Engineering Teams in the AI Era
addyosmani
9
1.8k
Transcript
Reactͷඇಉظॲཧ ϥΠϒϥϦΛΔ bruno / @nitaking_ エアークローゼット
About ɾSatoshi Nitawaki ɾࣾͰbrunoͱݺΕ͍ͯ·͢ ɾܦྺɿࣾSE / SIer ɾݴޠɿJava / PHP
7 / Laravel / ɹɹɹɹReact Native(React) ͳͲ
About ຊञͱԬ͕͖ͳΤϯδχΞͳͷͰ ͖ͳํ͜ͷޙ͠·͠ΐ͏ʂ
observableがキてるよ observableで Qiita書いた
Redux-Observable ͬͯͳΜͩ
None
RxJS 6-based middleware for Redux.
RxJS ͬͯͳΜͩ
৮ͬͯΈͨ
BufferCount: count͚ͩόοϑΝ Subscribe: Observer͕σʔλΛߪಡ(?)
৮ͬͯΈͨ
BufferWhen: fn͕ൃՐ͢Δ·ͰόοϑΝ͢Δ
γϦΞϧ௨৴ॲཧͬΆ͍ײ͡
センサ メイン機器 100ms毎とかで 送信 5000ms毎に データ回収 γϦΞϧ௨৴͜Μͳײ͡Ͱͨ͠
Redux-observable ʹͬͯ…
Ͳ͏ͬͯReduxͱ RxJS(ReactiveX)ͷ֓೦Λ Έ߹Θ͍ͤͯΔ͔ʁ
Action In , Action Out ͷ֓೦ ΠϥετɿTomas Nilsson Ҿ༻ɿhttps://makeitnew.io/epic-reactive-programming-with-redux-observable-eff4d3fb952f Epic:
͋ΔఔactionΛόοϑΝˍҰؾʹactionΛ࣮ߦ
ͳʹ͕Ͱ͖Δʁ ɾఆظతͳRequest ʢϙʔϦϯάʣ ɾϙʔϦϯάͷΩϟϯηϧ …etcɹ takeUntil: Ҿ͕؍ଌ͞ΕΔ·ͰΛ์ग़ => actionʹNAVIGATE_BACK͕དྷͨΒϙʔϦϯάΊΔ
ଞϥΠϒϥϦͱͷҧ͍ redux-thunkɿ ɹγϯϓϧɺͦͷෳࡶͳॲཧۤख(?) ɹdispatchࡁΈΞΫγϣϯͷΩϟϯηϧ͕ෆՄ redux-Observableɿ ɹΞΫγϣϯΛϙʔϦϯάͰ࣮ߦͨ͠ΓͰ͖Δ ɹdispatchࡁΈΞΫγϣϯͷΩϟϯηϧ͕Մೳ redux-sagaɿ ɹgeneratorؔʹΑΔ࣮ͷͨΊඇಉظॲཧͷதͰಉظతʹ࣮ ɹdispatchࡁΈΞΫγϣϯͷΩϟϯηϧ͕ෆՄ
ͱɺݴΘΕ͍ͯΔ
ReduxඇಉظϥΠϒϥϦ ɾେখؚΊΕ10ݸۙ͋͘Δ ɾٞͷత̏େϥΠϒϥϦ ɹ(saga/thunk/observable) ɾthunk × saga or observable ͍͍Αͱ͍͏આ
ɾRxJSͷ֓ཁͳΜͱͳ͘Θ͔͕ͬͨ ɾ·ͩ·ͩRxJSͷཧղ͕ඞཁͦ͏ɻएׯͷϋʔυϧʁ ɹ=> ͨͩ͠ɺJSҎ֎ʹݴޠԣஅతʹReactiveXͷ֓೦͑Δɹɹ ɹɹ=> େ͖ͳֶशίετͰͳ͍ʁ ɾReactiveXͷ֓೦͕γϦΞϧ௨৴ʹࣅͯͨ ɾsagaͱobservableൺֱ͞Ε͕͕ͪͩ༻ײҟͳΔʁʁ
͋Γ͕ͱ͏͍͟͝·ͨ͠