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
MonacaとFirebaseで始めるハイブリッドアプリ開発
Search
Daichi
April 07, 2018
Technology
0
1.8k
MonacaとFirebaseで始めるハイブリッドアプリ開発
2018年4月7日に行われたMonaca UG OHMIYAのLTで使用したスライド。
MonacaとFirebaseでサンプルアプリを作ってみました。
Daichi
April 07, 2018
Tweet
Share
More Decks by Daichi
See All by Daichi
プロダクト内で混在するUIと技術スタック、コーディングエージェントで整理できるか?
kandai
0
30
◯◯◯◯◯◯◯◯◯◯を使って簡単なゲームを作ってみた
kandai
0
1.7k
マージンを使わずに Webサイト構築してみた
kandai
0
3.3k
Jamstackの実案件で躓いたことや工夫したこと
kandai
0
1.5k
OpenAPIを使ってAPIドキュメントとモックサーバーを良い感じにした話
kandai
3
3.5k
WordPressサイトをNuxt.js × microCMSのJAMstack構成にリニューアルした話
kandai
1
1.7k
ブラウザの新しいAPIで遊んでみる
kandai
1
1.5k
Gridsome × Headless CMSでJAMstackなWebサイトを作る
kandai
1
1.1k
Media Session APIを使ってPWAの音楽プレイヤーを作る
kandai
0
570
Other Decks in Technology
See All in Technology
バイブコーディングと継続的デプロイメント
nwiizo
2
430
英語は話せません!それでも海外チームと信頼関係を作るため、対話を重ねた2ヶ月間のまなび
niioka_97
0
120
extension 現場で使えるXcodeショートカット一覧
ktombow
0
210
いま注目しているデータエンジニアリングの論点
ikkimiyazaki
0
600
SOC2取得の全体像
shonansurvivors
1
400
GopherCon Tour 概略
logica0419
2
190
KMP の Swift export
kokihirokawa
0
330
ZOZOのAI活用実践〜社内基盤からサービス応用まで〜
zozotech
PRO
0
180
いまさら聞けない ABテスト入門
skmr2348
1
210
BirdCLEF+2025 Noir 5位解法紹介
myso
0
200
ACA でMAGI システムを社内で展開しようとした話
mappie_kochi
1
270
Where will it converge?
ibknadedeji
0
190
Featured
See All Featured
Building Flexible Design Systems
yeseniaperezcruz
329
39k
The Language of Interfaces
destraynor
162
25k
Code Review Best Practice
trishagee
72
19k
Six Lessons from altMBA
skipperchong
28
4k
What’s in a name? Adding method to the madness
productmarketing
PRO
23
3.7k
Fireside Chat
paigeccino
40
3.7k
How STYLIGHT went responsive
nonsquared
100
5.8k
Docker and Python
trallard
46
3.6k
GitHub's CSS Performance
jonrohan
1032
460k
Building Better People: How to give real-time feedback that sticks.
wjessup
368
20k
Dealing with People You Can't Stand - Big Design 2015
cassininazir
367
27k
The Success of Rails: Ensuring Growth for the Next 100 Years
eileencodes
46
7.6k
Transcript
.POBDB 'JSFCBTFͰ ࢝ΊΔϋΠϒϦουΞϓϦ։ൃ 5".JODੁՈେ
5".JOD ౦ژ ੁՈେ%BJDIJ,BOLF ݩσβΠφʔͷϑϩϯτΤϯυΤϯδχΞɻ ࠓͬͺΒ)5.-$44+4ॻ͍ͯ·͢ɻ .58PSE1SFTTͷߏங͠·͢ɻ ࠷ۙϋΠϒϦουΞϓϦΣϒΞϓϦɻ ීஈॻ͘+4K2VFSZͱ"OHVMBS ܥ
͕ଟ͍ɻ ࠷ۙ7VFKT૿͖͑ͯ·ͨ͠ɻ
5".େࡕ େࡕࢢ۠ொ 5".౦ژ ౦ژઍా۠ਆాখொ ࡾ౦Ϗϧ' 5".4"/ʢγϯΨϙʔϧʣ #+BMBO#FTBS4JOHBQPSF 5".4'ʢαϯϑϥϯγείʣ "O[B#MWE 4VJUF
#VSMJOHBNF $" 5".-0/%0/ʢϩϯυϯʣ 'BJSGBY3PBE -POEPO /8&- 5".JOD
͠Ό͔͍͔ IUUQTXXXTIBLBJLBKQ 5JQT/PUF IUUQXXXUBNUBNDPKQUJQTOPUF
ࠓͷ .POBDB 'JSFCBTFͷΈ߹ΘͤͰ ؆୯ʹΞϓϦ͕࡞ΕΔͷ͔ݕূ ݸਓతʹ'JSFCBTFͬͯΈ͔ͨͬͨ
ࠓճࢼͨ͠ߏ w .POBDB w .POBDB$-* w 0OTFO6*GPS7VF w 'JSFCBTF 'JSFCBTFͰͬͨػೳ
w 4UPSBHF w 3FBMUJNF%BUBCBTF
ࠓճͷ͓ ࣋ͪͷཧΞϓϦ
ࠓճͷ͓ ࣋ͪͷཧΞϓϦ w ࣸਅΛࡱͬͯ'JSFCBTFͷετϨʔδʹอଘ w ࣸਅʹର໊ͯ͠લλάɾอଘͨ͠ը૾ͷ63-ͳͲ ͷใΛ͚ͭͯ'JSFCBTFͷϦΞϧλΠϜ%#ʹอଘ w ϦΞϧλΠϜ%#ͷσʔλΛҰཡͰදࣔ͢Δ w
σʔλ͕ߋ৽͞ΕͨΒҰཡΛߋ৽͢Δ
'JSFCBTFͷ४උ ࠷ॳͷઃఆͳͲத͞ΜͷهࣄͰʂ
'JSFCBTFͷ४උ ࠓճݕূͳͷͰɺೝূແ͠ͰσʔλͷొಡΈࠐΈ͕ग़ དྷΔΑ͏ʹϧʔϧͷλϒ͔Βมߋͯ͠࡞ۀ͠·ͨ͠ɻ
ΞϓϦͷݟͨ 0OTFO6*$44ͷࡉ͔͍࣮ આ໌͠·ͤΜ͕ɺ 0OTFO6*GPS7VFͷίϯϙʔ ωϯτͰΜͰ͍͘ͱɺ ΞϓϦͬΆ͍ݟͨڍಈ ͕؆୯ʹͰ͖Δʂ
ը૾ͷΞοϓϩʔυ %#ొ ӈԼͷΧϝϥϘλϯΛԡ͢ͱΧϝϥىಈɻ ը૾ΛࡱӨ͢Δͱɺใೖྗ͢ΔϞʔμϧΛදࣔɻ
ετϨʔδͷอଘɻ ࡱӨͨ͠ը૾ͷϑΝΠϧύεͰ ্ख͍͔ͣ͘base64Ͱొɻ Γํ͔Δਓ͓͑ͯͯͩ͘͠͠ ͍͞ɻ ͉ Ϟʔμϧͷొ͢ΔϘλϯΛԡͨ࣌͠ ͉ ετϨʔδͷอଘ͕͏·͘ߦͬ ͨΒRealtimeDBʹొɻ
ࢦఆͷURLʹPOST͢Δ͚ͩͰొ ͯ͘͠ΕΔͷͰָͪΜɻ
͜͜Ͱൃੜ ͓ɺԡͤͳ͍ʜ ಈ࡞֬ೝ͕ग़དྷͳ͍ʜ
ղܾ ͜ɺ͍ͭ͜ʜ ಈͧ͘ʜʂ
%#ΛҰཡදࣔ ϦΞϧλΠϜߋ৽ ొ͞Εͨ༰ΛϦΞϧλΠϜͰߋ৽ͯ͘͠ΕΔ
ಡΈࠐΈ࣌ʹϦΞϧλΠϜDBͷ σʔλΛऔಘͯ͠ΦϒδΣΫτʹ อଘɻ VueͷςϯϓϨʔτͰඳըॲཧ Realtime DatabaseͷσʔλΛҰཡͰදࣔ͢Δ ϦΞϧλΠϜDBʹΞΠςϜ͕ Ճ͞Εͨ࣌ͷΠϕϯτΛݕͯ͠ ΦϒδΣΫτʹՃ ͉
͉ ͉ σϑΥϧτͩͱɺ࠷৽ͷΞΠςϜ ͕Լʹདྷͯ͠·͏ͷͰɺฒͼΛٯ ʹͯ͠ฦ͢ॲཧ
·ͱΊ w 0OTFO6*Λ͑ΞϓϦͬΆ͍ݟͨڍಈ͕؆୯ ʹग़དྷΔ w .POBDB%FCVHFSͷϝχϡʔϘλϯಈ͘ʂ w 'JSFCBTF؆୯ʹσʔλͷొಡΈࠐΈ͕Ͱ͖Δ ͷͰɺ؆୯ʹΞϓϦ։ൃΛ࢝ΊΒΕΔʂ
͋Γ͕ͱ͏͍͟͝·ͨ͠ʂ