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
Firebaseオンリー + React Nativeでアプリを作ると果たして簡単になるのか?
Search
Sponsored
·
Your Podcast. Everywhere. Effortlessly.
Share. Educate. Inspire. Entertain. You do you. We'll handle the rest.
→
Yu Watanabe
December 03, 2019
Technology
1.3k
4
Share
Firebaseオンリー + React Nativeでアプリを作ると果たして簡単になるのか?
バックエンドをFirebaseにし、アプリをReact Nativeで作ると通常作るよりも簡単にできるのかについての発表となります。
Yu Watanabe
December 03, 2019
More Decks by Yu Watanabe
See All by Yu Watanabe
依存ライブラリを薄くするために車輪を再開発してもいいんだよ🛞
watanabeyu
0
150
Bolt 🤝 Expo
watanabeyu
0
400
npm packageとリリースとモノレポ
watanabeyu
0
79
react-native-ffmpegを使って動画をいじくりmawasou
watanabeyu
0
1k
react-native-unimodulesを用いてのApp内課金実装
watanabeyu
0
1.2k
gandhの紹介です
watanabeyu
0
45
XcodeやAndroid Studioを弄らないアイコン管理
watanabeyu
2
700
react-native-unimodulesのススメ
watanabeyu
1
6.7k
JavaScript製npmパッケージをTypeScriptで書き直した話
watanabeyu
0
1.2k
Other Decks in Technology
See All in Technology
100マイクロサービスのTerraform/Kubernetes管理地獄から抜け出すためのAI活用術
markie1009
0
150
Agent の「自由」と「安全」〜未来に向けて今できること〜
katayan
0
360
大学職員のための生成AI最前線 :最前線を、AIガバナンスとして読み直すためのTips
gmoriki
2
4k
20260516_SecJAWS_Days
takuyay0ne
2
380
Tachikawa.any 運営挨拶
daitasu
0
170
クラウドネイティブ DB はいかにして制約を 克服したか? 〜進化歴史から紐解く、スケーラブルアーキテクチャ設計指針〜
hacomono
PRO
6
940
自動テストだけで リリース判断できるチームへ - 鍵はテストの量ではなくリリース判断基準の再設計にあった / Redesigning Release Criteria for Lightweight Releases
ewa
7
3.7k
Databricks 月刊サービスアップデートまとめ 2026年04月号
tyosi1212
0
120
AWS WAFの運用を地道に改善し、自社で運用可能にするプラクティス
andpad
1
120
Sociotechnical Architecture Reviews: Understanding Teams, not just Artefacts
ewolff
1
170
拝啓、あの夏の僕へ〜あなたも知っているApp Runnerの世界〜
news_it_enj
0
240
PdM・Eng・QAで進めるAI駆動開発の現在地/aidd-with-pdm-eng-qa
shota_kusaba
0
220
Featured
See All Featured
Scaling GitHub
holman
464
140k
Gemini Prompt Engineering: Practical Techniques for Tangible AI Outcomes
mfonobong
2
390
Done Done
chrislema
186
16k
How to Create Impact in a Changing Tech Landscape [PerfNow 2023]
tammyeverts
55
3.3k
The Straight Up "How To Draw Better" Workshop
denniskardys
239
140k
Paper Plane (Part 1)
katiecoart
PRO
0
7.3k
How to Talk to Developers About Accessibility
jct
2
190
Navigating Weather and Climate Data
rabernat
0
190
ラッコキーワード サービス紹介資料
rakko
1
3.3M
Cheating the UX When There Is Nothing More to Optimize - PixelPioneers
stephaniewalter
287
14k
HTML-Aware ERB: The Path to Reactive Rendering @ RubyCon 2026, Rimini, Italy
marcoroth
1
44
The State of eCommerce SEO: How to Win in Today's Products SERPs - #SEOweek
aleyda
2
10k
Transcript
2019/12/03 ΘͨͳΏ͏ FIREBASEΦϯϦʔ + REACT NATIVEͰ ΞϓϦΛ࡞ΔͱՌͨͯ͠؆୯ʹͳΔͷ͔ʁ
▸ ࣗݾհ ▸ ؆୯ʹͳͬͨͳͱײͨ͡෦ ▸ ਏ͔ͬͨ෦ ▸ ͨ͠෦ ▸ Ͳ͏͍͏ΞϓϦʹ͍ͯΔ͔
▸ ·ͱΊ ֓ཁ
ࣗݾհ(1) ΘͨͳΏ͏ ▸ ॴଐ ▸ גࣜձࣾg&h ▸ Web / ΞϓϦΛझຯͰެ։
▸ ࣄ༰ ▸ αʔό / ϑϩϯτ / ΞϓϦ / Web ▸ ΞΧϯτ ▸ Twitter : @hmktsu ▸ Github : @watanabeyu
ࣗݾհ(2) ▸ https://www.gandh.jp ▸ 5໊(ΤϯδχΞ2ਓ)Ͱฏۉྸ30ͪΐ͍ͷձࣾ ▸ ετϦʔτΧϧνϟʔ × ITͳαʔϏεΛӡӦ ▸
ࠓ࡞͍ͬͯΔࣄۀ ▸ ετϦʔτμϯεͷΦϯϥΠϯϨοεϯΞϓϦ ▸ react-native + firebase + TypeScript
FIREBASEΦϯϦʔ + REACT NATIVEͰΞϓϦΛ࡞ΔͱՌͨͯ͠؆୯ʹͳΔͷ͔ʁ ͍͖ͳΓ͚ͩͲ݁ ͍ͩͿ؆୯ʹͳͬͨؾ͕͢Δ
Ͳ͕͜؆୯ʹͳͬͨͷ͔ʁ(1) ʙೝূ෦ʙ ▸ AuthenticationΛ͏͜ͱͰϢʔβ෦Λ·Δ·ΔεΩοϓ ▸ ϝʔϧΞυϨε֬ೝػೳ ▸ ύεϫʔυมߋػೳ ▸ ࣗಈૹ৴ϝʔϧΛݴޠ͝ͱʹมߋՄೳ
Ͳ͕͜؆୯ʹͳͬͨͷ͔ʁ(2) ʙσʔλ෦ʙ ▸ Firestore͔ΒσʔλΛऔಘ ▸ ϧʔϧͷมͱͯ͠authͳͲ͑ΔͷͰ੍ݶ͕؆୯ ▸ FirestoreΛτϦΨʔͱͯ͠FunctionsΛىಈͤͯ͞ͷσʔλཧ ▸ ΞϓϦweb΄΅΄΅ڞ௨Ͱσʔλऔಘ༻͕ؔॻ͚Δ
Ͳ͕͜؆୯ʹͳͬͨͷ͔ʁ(3) ʙͦͷଞʙ ▸ όοΫΤϯυΛ༻͍Δඞཁ͕ͳ͔ͬͨ ▸ ཧը໘͕ॆ࣮͍ͯ͠ΔͳͲͳͲ
FIREBASEΦϯϦʔ + REACT NATIVEͰΞϓϦΛ࡞ΔͱՌͨͯ͠؆୯ʹͳΔͷ͔ʁ ͱ͍͑Ͳਏ͍෦͋Γ
Ͳ͕͜ਏ͔ͬͨͷ͔ʁ ▸ AuthenticationͰ࣋ͯΔใݶΒΕΔ ▸ id,email,displayName, photoUrl,emailVerified,֤छϓϩύΠμ ▸ FirestoreʹσʔλΛͦͷ··ೖΕΔ͜ͱ͕Ͱ͖ΔͷͰɺ ϑϩϯτଆͷόϦσʔγϣϯΛ͔ͬ͠Γͱ͠ͳ͍ͱ͍͚ͳ͍ ▸
ϧʔϧΛશһ͕ͪΌΜͱѲ͍ͯ͠Δ͔ ▸ Firestore͋͘·ͰNoSQLతͳ෦ྨͳͷͰݕࡧڧ͘ͳ͍ ▸ ίϨΫγϣϯ͕૿͑ΔͱτϦΨʔͷѲ͕໘ʹ ▸ ίϨΫγϣϯ͕૿͑Δͱ͍Δͷ͔͍Βͳ͍ͷ͔͕͘͠ͳΔ ▸ ෳϦϙδτϦʹލͬͨ߹ͷFunctionsͷཧํ๏ ▸ ͳͲͳͲ…
FIREBASEΦϯϦʔ + REACT NATIVEͰΞϓϦΛ࡞ΔͱՌͨͯ͠؆୯ʹͳΔͷ͔ʁ ͜͏͍͏Λ͠·ͨ͠
Ͳ͏͍͏Λ͔ͨ͠ʁ(1) ▸ TypeScriptͰFirestoreͷίϨΫγϣϯͷܕΛͪΌΜͱཧ ▸ ݕࡧ݁ՌΛ͋Β͔͡Ίอଘ͓ͯ͘͠ ▸ HIPHOPʹؔ͢ΔϨοεϯΛอଘ͓ͯ͘͠υΩϡϝϯτΛ༻ҙͳͲ ▸ NoSQLͱ͍͏͜ͱΛ಄ʹೖΕͯίϨΫγϣϯͳͲΛ࡞ ▸
τϦΨʔͳͲؔ࿈ੑΛͪΌΜͱਤʹॻ͍ͯѲ
Ͳ͏͍͏Λ͔ͨ͠ʁ(2) ▸ AdminͰ͍͍ͨɺΞϓϦͰ͍͍ͨɺ WebͰ͍͍ͨΑ͏ͳ FunctionsͦΕͧΕͷϦϙδτϦʹׂͯ͠ཧ ▸ exports͢ΔؔΛΦϒδΣΫτʹ͢Δ $ firebase deploy
--only functions:admin exports.admin = { func1: require(“./func1”), func2: require(“./func2”), };
FIREBASEΦϯϦʔ + REACT NATIVEͰΞϓϦΛ࡞ΔͱՌͨͯ͠؆୯ʹͳΔͷ͔ʁ ͜͏͍ͬͨΞϓϦͩͱ࠾༻͠ͳ͔͔ͬͨ
͜͏͍͏ΞϓϦͩͱ࠾༻͠ͳ͔͔ͬͨ ▸ SNSͷΑ͏ͳϦϨʔγϣϯ͕ෳࡶʹབྷΈ߹͏Α͏ͳαʔϏε ▸ firestorefunctions͕ೖΓཚΕͯ͠·͏ͨΊ ▸ ݕࡧ͕݅ෳࡶͩͬͨΓ͢ΔΑ͏ͳαʔϏε ▸ ෳ߹ΠϯσοΫεશจݕࡧͷͨΊʹalgoliaಋೖͳͲ͕໘ ▸
ήʔϜͷΑ͏ͳεϐʔυΛॏཁࢹ͍ͨ͠αʔϏε ▸ τϥϯβΫγϣϯॻ͖ࠐΈ͕ωοΫͱͳΔͷͰ ͖ෆ͖͕͋ΔͷͰཁҙ
FIREBASEΦϯϦʔ + REACT NATIVEͰΞϓϦΛ࡞ΔͱՌͨͯ͠؆୯ʹͳΔͷ͔ʁ ·ͱΊ
·ͱΊ ▸ ඇSNSΞϓϦͰ؆୯ʹͳΔͷͰ͓͢͢Ί ▸ ୯७ʹίϨΫγϣϯ͔Βऔಘ͢ΔΑΓɺ ݕࡧ݁ՌΛ·ͱΊͨυΩϡϝϯτΛ༻ҙ͓ͯ͘͠ͱΤίͰָ ▸ τϦΨʔىಈͷFunctionsͳͲ͕େྔʹઃஔ͞ΕΔՄೳੑ͕ߴ͍ͷͰɺ ͔ͬ͠ΓͱؔੑΛཧͰ͖ΔΑ͏ͳֆΛඳ͘ ▸
ຊLTͰհ͍ͯ͠ͳ͍͕ɺFCMΞφϦςΟΫεͳͲΞϓϦΛ࡞Δ্ Ͱඞཁͳͷ͕શͯἧ͍ͬͯΔ ࡞Γ͍ͨͷʹΑΔ͕ গਓͰͺͺͬͱ։ൃΛ͢ΔͳΒ!
͓ΘΓ