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
Does react-redux-firebase spark joy?
Search
Sponsored
·
Your Podcast. Everywhere. Effortlessly.
Share. Educate. Inspire. Entertain. You do you. We'll handle the rest.
→
Nokogiri
March 23, 2019
Technology
220
1
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
Does react-redux-firebase spark joy?
Nokogiri
March 23, 2019
More Decks by Nokogiri
See All by Nokogiri
Zustandを用いた実践的状態管理
undefined_name
3
910
React Testing Libraryでの WAI-ARIAロールの活用事例
undefined_name
1
220
自動テストは何の役に立つのか そして役に立たないのか
undefined_name
5
1.8k
Pipe Operator (|>) の紹介
undefined_name
2
410
FizzBuzzで学ぶOCP
undefined_name
0
160
エンジニアとQAでコラボするフロントエンドリアーキテクチャ開発の事例
undefined_name
4
3.2k
オブジェクト指向のプラクティスをフロントエンドで活用する
undefined_name
7
1.8k
モププロ@kintone開発チーム
undefined_name
1
660
勉強会で登壇者に 質問しづらい課題を解決する サービスをリリースしました🎉
undefined_name
2
1.4k
Other Decks in Technology
See All in Technology
20分でわかるセキュアAPI
nwiizo
1
210
Software Supply Chain Attackからクラウド環境を守るためにできること
lhazy
2
220
生成 AI の基礎 〜 サンプル実装で学ぶ基本原理
enakai00
7
4.4k
強化学習「理論」入門
enakai00
3
3.6k
名刺メーカーDevグループ 紹介資料
sansan33
PRO
0
1.2k
取引先から届く 「セキュリティチェックシート」の読み解き方
kamadamakoto
0
140
メルカリのグローバルアプリで挑んだ AlloyDB 運用と課題解決の実践記
hatappi
0
240
関東Kaggler会発表資料
takoi
1
200
OSPN.JPバージョンアップ作業進捗のご報告 / 20260801-osc26kyoto
akkiesoft
0
430
クラウドセキュリティ入門 ~安全なクラウド利用のための基礎知識~
lhazy
12
8.4k
モダンフロントエンド 開発研修
recruitengineers
PRO
4
570
AIは実装を速くする。では、私たちは何を今作るべきか?-立場を越えてリリースに向き合ったチーム開発の実践 / 20260801 Hiromi Nakaya and Naoki Takahashi
shift_evolve
PRO
3
450
Featured
See All Featured
Helping Users Find Their Own Way: Creating Modern Search Experiences
danielanewman
31
3.3k
Keith and Marios Guide to Fast Websites
keithpitt
413
23k
How To Speak Unicorn (iThemes Webinar)
marktimemedia
1
520
For a Future-Friendly Web
brad_frost
183
10k
ラッコキーワード サービス紹介資料
rakko
1
4.3M
GraphQLとの向き合い方2022年版
quramy
50
15k
How to Create Impact in a Changing Tech Landscape [PerfNow 2023]
tammyeverts
56
3.4k
Visualization
eitanlees
152
17k
エンジニアに許された特別な時間の終わり
watany
108
250k
Code Review Best Practice
trishagee
74
20k
コードの90%をAIが書く世界で何が待っているのか / What awaits us in a world where 90% of the code is written by AI
rkaga
63
45k
How to build a perfect <img>
jonoalderson
1
5.9k
Transcript
Does react-redux-firebase spark joy ? 2019/03/24 @Firebase Meetup in Osaka
#2
Does react-redux-firebase spark joy? ૣͰ͕͢ɺ react-redux-firebase ͬͯΔਓʁ ΞΠεϒϨΠΫ
Does react-redux-firebase spark joy? ຊ͢͜ͱ React-ReduxΞϓϦΛFirebaseͰ࡞ΔͳΒ͜ͷ ϥΠϒϥϦ͕ΊͪΌͪ͘ΌSpark Joy ͩΑ ͱ͍͏͓Λ͠·͢ɻ
Does react-redux-firebase spark joy? ࣍ 00.react-redux-firebaseͱ 02.࡞ͬͨαʔϏεʹ͍ͭͯ 02. ͖ͳͱ͜Ζ 03.
٧·ͬͨͱ͜Ζ 04. ݁
00. react-redux-firebaseͱ
Does react-redux-firebase spark joy? 00. react-redux-firebaseͱ - React-ReduxΞϓϦ͔ΒFirebaseΛར༻͢Δͱ͖ʹ͑Δศརπʔϧ - ReactͷHOCͱͯ͠ར༻Ͱ͖Δ
- Document͕ॆ࣮͍ͯ͠Δʢhttp://react-redux-firebase.com/ʣ - FirestoreΛ͏ʹผ్Λ redux-firestore ར༻͢Δ https://github.com/prescottprue/react-redux-firebase
01. ࡞ͬͨαʔϏεʹ͍ͭͯ
Does react-redux-firebase spark joy? 01. ࡞ͬͨαʔϏεʹ͍ͭͯ - ొஃऀ͕ษڧձͰϑΟʔυόοΫΛಘΒΕʹ͍͘ - ͕࣌ؒͳ͔ͬͨΓɺஏ͔ͣͯ͘͠खΛ্͛ͮΒ͍
- ొஃऀͷ࣭ײΛಗ໊ & ه໊ͰߘͰ͖Δ - άϧʔϓνϟοτϥΠΫͳαʔϏε PutYourHandsUp ~Where feedback to the speakers gather. pyhu.nkgr.app
Does react-redux-firebase spark joy? 01. ࡞ͬͨαʔϏεʹ͍ͭͯ - ొஃऀ͕ษڧձͰϑΟʔυόοΫΛಘΒΕʹ͍͘ - ͕࣌ؒͳ͔ͬͨΓɺஏ͔ͣͯ͘͠खΛ্͛ͮΒ͍
- ొஃऀͷ࣭ײΛಗ໊ & ه໊ͰߘͰ͖Δ - άϧʔϓνϟοτϥΠΫͳαʔϏε PutYourHandsUp ~Where feedback to the speakers gather.
Does react-redux-firebase spark joy? 01. ࡞ͬͨαʔϏεʹ͍ͭͯ ΞʔΩςΫνϟͱׂ FrontEnd BackEndService React
- ೝূ / DB / Hosting - ΞΫηεղੳGoogleAnalitics 'JSFTUPSF Written in react-redux- firebase
02. ͖ͳͱ͜Ζ
Does react-redux-firebase spark joy? 02. ͖ͳͱ͜Ζ - withFirestoreΛHOCͰrecompose͢Δ͜ͱͰ Firestore͕ఏڙ͢Δ͕ؔར༻Ͱ͖ΔΑ͏ʹͳ Δ
- Get / SetListener Λར༻͢Δ͜ͱͰ redux Storeʹ state.firestore.ordered.xxxͰΞΫη ε͢Δ͜ͱ͕Ͱ͖Δ - ӬଓσʔλFirestoreʹɻredux StoreΞϓ Ϧέʔγϣϯͷঢ়ଶཧʹప͢Δ͜ͱ͕Ͱ͖ Δɻ - setListenerΛ͏͜ͱͰUpdateSetΛ͏ ͱαʔόʔ͔Βfetch͠ͳͯ͘ϦΞϧλΠϜʹ state͕มߋ͞Είϯϙʔωϯτ͕࠶ඳը͞ΕΔ FirestoreΛReduxͷStoreͷΑ͏ʹѻ͑Δ
Does react-redux-firebase spark joy? 02. ͖ͳͱ͜Ζ - ͜Ε͚ͩͰTwitterͷϩάΠϯϙοϓΞοϓͷ ग़ྗ ->
ΓͰϩάΠϯࡁΈϢʔβʔใͷऔ ಘ·ͰͰ͖Δʂ AuthपΓఏڙFunction ͕͍͍͢ - ϩάΠϯεςʔλεΛνΣοΫͰ͖Δ isLoaded, isEmpty ͕ײత
03. ٧·ͬͨͱ͜Ζ
Does react-redux-firebase spark joy? 03. ٧·ͬͨͱ͜Ζ - ϥΠϒϥϦͷͰͳ͘TypeScriptͷ͕ͩɺܕ͕ͳ ͍ͷͰࣗલͰఆ͕ٛඞཁɻ -
PR͛Α͏͔ͱࢥ͕ͬͨɺαʔόʔ͔Βະऔಘ࣌ͳͲอ࣋ ͢Δσʔλ͕ҧ͏Έ͍ͨͳͷͰҰ୴ଘஔͯ͠͠·ͬͨ… react-redux-firebase , redux-firestore ͷ ܕఆ͕ٛͳ͍…
Does react-redux-firebase spark joy? 03. ٧·ͬͨͱ͜Ζ - ௨৴ͷΈAuthͳͲΊͪΌͪ͘Όศརͳ໘ɺଞͷα ʔϏεʹͳ͍ͷͰɺҠΕͳ͍… -
Firebase,Firestoreʹͳ͍ػೳ͑ͳ͍ (GraphQLͱ͔WebαʔϏεͷϩάͱ͔) ΞϓϦέʔγϣϯ͕FirebaseʹϩοΫΠϯ͞ΕΔ
04ɽ݁
Does react-redux-firebase spark joy? • ϑϩϯτΤϯυϗετڥͱͯ͠Firebase࠷ߴ • ϑϧϚωʔδυͳNoSQL DBͱ͍͍ͯ͢͠ʂ •
RealTimeͳ௨৴͕WebSocketͷݟ͕ͳ࣮ͯ͘ݱͰ͖ΔFirestore࠷ߴ • ࠓͷͱ͜ΖϨΠςϯγૣ͍ͱײ͡Δ͠ɺදࣔͳ͍ 04ɽ݁ Firebase Firestore spark joy react-redux-firebase spark joy • Firebase͏ͳΒͥͻ͏͖ʂ