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.6k
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
◯◯◯◯◯◯◯◯◯◯を使って簡単なゲームを作ってみた
kandai
0
4
Jamstackの実案件で躓いたことや工夫したこと
kandai
0
1.3k
OpenAPIを使ってAPIドキュメントとモックサーバーを良い感じにした話
kandai
3
3.3k
WordPressサイトをNuxt.js × microCMSのJAMstack構成にリニューアルした話
kandai
1
1.5k
ブラウザの新しいAPIで遊んでみる
kandai
1
1.3k
Gridsome × Headless CMSでJAMstackなWebサイトを作る
kandai
1
990
Media Session APIを使ってPWAの音楽プレイヤーを作る
kandai
0
460
CSS組版で技術書を作った話
kandai
0
360
Web技術だけで作るQRコードリーダー
kandai
2
2k
Other Decks in Technology
See All in Technology
君は隠しイベントを見つけれるか?
mujyun
0
280
最速最小からはじめるデータプロダクト / Data Product MVP
amaotone
5
730
ユーザーの購買行動モデリングとその分析 / dsc-purchase-analysis
cyberagentdevelopers
PRO
2
100
バクラクにおける可観測性向上の取り組み
yuu26
3
410
[AWS JAPAN 生成AIハッカソン] Dialog の紹介
yoshimi0227
0
150
来年もre:Invent2024 に行きたいあなたへ - “集中”と“つながり”で楽しむ -
ny7760
0
460
【技術書典17】OpenFOAM(自宅で極める流体解析)2次元円柱まわりの流れ
kamakiri1225
0
210
GitHub Universe: Evaluating RAG apps in GitHub Actions
pamelafox
0
170
端末が簡単にリモートから操作されるデモを通じて ソフトウェアサプライチェーン攻撃対策の重要性を理解しよう
kitaji0306
0
170
APIテスト自動化の勘所
yokawasa
7
4.1k
新卒1年目が向き合う生成AI事業の開発を加速させる技術選定 / ai-web-launcher
cyberagentdevelopers
PRO
7
1.5k
わたしとトラックポイント / TrackPoint tips
masahirokawahara
1
240
Featured
See All Featured
Intergalactic Javascript Robots from Outer Space
tanoku
268
27k
RailsConf & Balkan Ruby 2019: The Past, Present, and Future of Rails at GitHub
eileencodes
131
33k
Being A Developer After 40
akosma
86
590k
Save Time (by Creating Custom Rails Generators)
garrettdimon
PRO
27
790
Thoughts on Productivity
jonyablonski
67
4.3k
How To Stay Up To Date on Web Technology
chriscoyier
788
250k
Building Flexible Design Systems
yeseniaperezcruz
327
38k
Practical Tips for Bootstrapping Information Extraction Pipelines
honnibal
PRO
9
680
VelocityConf: Rendering Performance Case Studies
addyosmani
325
24k
4 Signs Your Business is Dying
shpigford
180
21k
Navigating Team Friction
lara
183
14k
Optimising Largest Contentful Paint
csswizardry
33
2.9k
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؆୯ʹσʔλͷొಡΈࠐΈ͕Ͱ͖Δ ͷͰɺ؆୯ʹΞϓϦ։ൃΛ࢝ΊΒΕΔʂ
͋Γ͕ͱ͏͍͟͝·ͨ͠ʂ