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
Yu Watanabe
December 03, 2019
Technology
4
1.2k
Firebaseオンリー + React Nativeでアプリを作ると果たして簡単になるのか?
バックエンドをFirebaseにし、アプリをReact Nativeで作ると通常作るよりも簡単にできるのかについての発表となります。
Yu Watanabe
December 03, 2019
Tweet
Share
More Decks by Yu Watanabe
See All by Yu Watanabe
Bolt 🤝 Expo
watanabeyu
0
290
npm packageとリリースとモノレポ
watanabeyu
0
58
react-native-ffmpegを使って動画をいじくりmawasou
watanabeyu
0
870
react-native-unimodulesを用いてのApp内課金実装
watanabeyu
0
1.1k
gandhの紹介です
watanabeyu
0
32
XcodeやAndroid Studioを弄らないアイコン管理
watanabeyu
2
630
react-native-unimodulesのススメ
watanabeyu
1
6.4k
JavaScript製npmパッケージをTypeScriptで書き直した話
watanabeyu
0
1.1k
React Native Expoで行うアプリの簡単最速運用
watanabeyu
0
330
Other Decks in Technology
See All in Technology
Microsoft Fabric vs Databricks vs (Snowflake) -若手エンジニアがそれぞれの強みと違いを比較してみた- "A Young Engineer's Comparison of Their Strengths and Differences"
reireireijinjin6
1
140
Azure Maps Visual in PowerBIで分析しよう
nakasho
0
200
非root化Androidスマホでも動く仮想マシンアプリを試してみた
arkw
0
110
Databricksで完全履修!オールインワンレイクハウスは実在した!
akuwano
0
150
Terraform にコントリビュートしていたら Azure のコストをやらかした話 / How I Messed Up Azure Costs While Contributing to Terraform
nnstt1
1
260
地味にいろいろあった! 2025春のAmazon Bedrockアップデートおさらい
minorun365
PRO
2
560
AWSを利用する上で知っておきたい名前解決の話
nagisa53
6
710
エンジニアリングで組織のアウトカムを最速で最大化する!
ham0215
1
290
Ninno LT
kawaguti
PRO
1
110
製造業向けIoTソリューション提案資料.pdf
haruki_uiru
0
200
PagerDuty×ポストモーテムで築く障害対応文化/Building a culture of incident response with PagerDuty and postmortems
aeonpeople
3
560
グループ ポリシー再確認 (2)
murachiakira
0
230
Featured
See All Featured
The Language of Interfaces
destraynor
158
25k
Fontdeck: Realign not Redesign
paulrobertlloyd
84
5.5k
Intergalactic Javascript Robots from Outer Space
tanoku
271
27k
KATA
mclloyd
29
14k
Agile that works and the tools we love
rasmusluckow
329
21k
Designing Dashboards & Data Visualisations in Web Apps
destraynor
231
53k
Automating Front-end Workflow
addyosmani
1370
200k
Being A Developer After 40
akosma
91
590k
The Success of Rails: Ensuring Growth for the Next 100 Years
eileencodes
45
7.2k
[RailsConf 2023 Opening Keynote] The Magic of Rails
eileencodes
29
9.4k
Evolution of real-time – Irina Nazarova, EuRuKo, 2024
irinanazarova
8
700
Easily Structure & Communicate Ideas using Wireframe
afnizarnur
194
16k
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ΞφϦςΟΫεͳͲΞϓϦΛ࡞Δ্ Ͱඞཁͳͷ͕શͯἧ͍ͬͯΔ ࡞Γ͍ͨͷʹΑΔ͕ গਓͰͺͺͬͱ։ൃΛ͢ΔͳΒ!
͓ΘΓ