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
190
0
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
React非同期ライブラリを知る
rxjs redux-observableについて
nitaking
September 28, 2018
More Decks by nitaking
See All by nitaking
人は30分でLT資料を作って発表できるのか
nitaking
0
280
React Native ことはじめ
nitaking
0
280
2021-06-24 最近のビルドツール調べてみた
nitaking
0
160
Fishのススメ
nitaking
0
98
Blitz.jsの紹介
nitaking
1
1.1k
Expo WEB × Next.js は実用できるのか?
nitaking
3
1.1k
react-hooks-loggerつくった話
nitaking
0
540
あの震えるインタラクションを実装したい
nitaking
1
1.5k
アプリリリースまでのつらみあれこれ
nitaking
0
710
Featured
See All Featured
世界の人気アプリ100個を分析して見えたペイウォール設計の心得
akihiro_kokubo
PRO
71
40k
Navigating the moral maze — ethical principles for Al-driven product design
skipperchong
2
390
Joys of Absence: A Defence of Solitary Play
codingconduct
1
400
The Art of Programming - Codeland 2020
erikaheidi
57
14k
Building a Scalable Design System with Sketch
lauravandoore
463
34k
The Straight Up "How To Draw Better" Workshop
denniskardys
239
140k
Into the Great Unknown - MozCon
thekraken
41
2.6k
The Impact of AI in SEO - AI Overviews June 2024 Edition
aleyda
5
1.1k
Game over? The fight for quality and originality in the time of robots
wayneb77
1
200
Making the Leap to Tech Lead
cromwellryan
135
9.9k
Improving Core Web Vitals using Speculation Rules API
sergeychernyshev
21
1.5k
Why Mistakes Are the Best Teachers: Turning Failure into a Pathway for Growth
auna
0
160
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ൺֱ͞Ε͕͕ͪͩ༻ײҟͳΔʁʁ
͋Γ͕ͱ͏͍͟͝·ͨ͠