MonacaとFirebaseで始めるハイブリッドアプリ開発

2018年4月7日に行われたMonaca UG OHMIYAのLTで使用したスライド。
MonacaとFirebaseでサンプルアプリを作ってみました。

Transcript

1. .POBDB
   
   'JSFCBTFͰ
   ࢝ΊΔϋΠϒϦουΞϓϦ։ൃ
   
   5".JOD
   
   ੁՈ
   େ஍
2. 5".JOD ౦ژ
   ੁՈ
   େ஍
   
   %BJDIJ
   ,BOLF
   ݩσβΠφʔͷϑϩϯτΤϯυΤϯδχΞɻ
   ࠓ͸΋ͬͺΒ)5.-$44+4ॻ͍ͯ·͢ɻ
   .5΍8PSE1SFTTͷߏங΋͠·͢ɻ
   ࠷ۙ͸ϋΠϒϦουΞϓϦ΍΢ΣϒΞϓϦ΋ɻ ීஈॻ͘+4͸K2VFSZͱ"OHVMBS ܥ ͕ଟ͍ɻ
   ࠷ۙ͸7VFKT΋૿͖͑ͯ·ͨ͠ɻ
   
3. 5".
   େࡕ
   େࡕࢢ๺۠຤޿ொ
   5".౦ژ
   ౦ژ౎ઍ୅ా۠ਆాখ઒ொ
   ࡾ౦Ϗϧ'
   5".4"/
   ʢγϯΨϙʔϧʣ
   #
   +BMBO
   #FTBS
   4JOHBQPSF
   
   5".
   4'
   ʢαϯϑϥϯγείʣ
   
   "O[B
   #MWE 4VJUF
    #VSMJOHBNF
   $"
   5".
   -0/%0/ʢϩϯυϯʣ
   
   'BJSGBY
   3PBE -POEPO /8
   &-
   5".JOD
4. ͠Ό͔͍͔
   
   IUUQTXXXTIBLBJLBKQ 5JQT
   /PUF
   
   IUUQXXXUBNUBNDPKQUJQTOPUF
5. ࠓ೔ͷ࿩ .POBDB
   
   'JSFCBTFͷ૊Έ߹ΘͤͰ
   ؆୯ʹΞϓϦ͕࡞ΕΔͷ͔ݕূ
   ݸਓతʹ'JSFCBTF࢖ͬͯΈ͔ͨͬͨ
6. ࠓճࢼͨ͠ߏ੒ w .POBDB
   w .POBDB
   $-*
   w 0OTFO
   6*
   GPS
   7VF
   w 'JSFCBTF
   'JSFCBTFͰ࢖ͬͨػೳ
   w 4UPSBHF
   w 3FBMUJNF
   %BUBCBTF
7. ࠓճͷ͓୊ ࣋ͪ෺ͷ؅ཧΞϓϦ
8. ࠓճͷ͓୊ ࣋ͪ෺ͷ؅ཧΞϓϦ w ࣸਅΛࡱͬͯ'JSFCBTFͷετϨʔδʹอଘ
   w ࣸਅʹର໊ͯ͠લ΍λάɾอଘͨ͠ը૾ͷ63-ͳͲ ͷ৘ใΛ͚ͭͯ'JSFCBTFͷϦΞϧλΠϜ%#ʹอଘ
   w ϦΞϧλΠϜ%#ͷσʔλΛҰཡͰදࣔ͢Δ
   w σʔλ͕ߋ৽͞ΕͨΒҰཡΛߋ৽͢Δ
9. 'JSFCBTFͷ४උ ࠷ॳͷઃఆͳͲ͸த௡઒͞ΜͷهࣄͰʂ
   
10. 'JSFCBTFͷ४උ ࠓճ͸ݕূͳͷͰɺೝূແ͠Ͱσʔλͷొ࿥΍ಡΈࠐΈ͕ग़ དྷΔΑ͏ʹϧʔϧͷλϒ͔Βมߋͯ͠࡞ۀ͠·ͨ͠ɻ
    
11. ΞϓϦͷݟͨ໨ 0OTFO
    6*΍$44ͷࡉ͔͍࣮ ૷͸આ໌͠·ͤΜ͕ɺ
    0OTFO
    6*
    GPS
    7VFͷίϯϙʔ ωϯτͰ૊ΜͰ͍͘ͱɺ
    ΞϓϦͬΆ͍ݟͨ໨΍ڍಈ ͕؆୯ʹͰ͖Δʂ
12. ը૾ͷΞοϓϩʔυ
    
    %#ొ࿥ ӈԼͷΧϝϥϘλϯΛԡ͢ͱΧϝϥىಈɻ
    ը૾ΛࡱӨ͢Δͱɺ৘ใೖྗ͢ΔϞʔμϧΛදࣔɻ
13. ετϨʔδ΁ͷอଘɻ ࡱӨͨ͠ը૾ͷϑΝΠϧύεͰ͸ ্ख͍͔ͣ͘base64Ͱొ࿥ɻ ΍Γํ෼͔Δਓ͓͑ͯͯͩ͘͠͠ ͍͞ɻ ͉ Ϟʔμϧͷొ࿥͢ΔϘλϯΛԡͨ࣌͠ ͉ ετϨʔδ΁ͷอଘ͕͏·͘ߦͬ ͨΒRealtimeDBʹ΋ొ࿥ɻ ࢦఆͷURLʹPOST͢Δ͚ͩͰొ ࿥ͯ͘͠ΕΔͷͰָͪΜɻ
14. ͜͜Ͱ໰୊ൃੜ ͓ɺԡͤͳ͍ʜ
    ಈ࡞֬ೝ͕ग़དྷͳ͍ʜ
15. ղܾ ͜ɺ͍ͭ͜ʜ
    ಈͧ͘ʜʂ
16. %#ΛҰཡදࣔ
    
    ϦΞϧλΠϜߋ৽ ొ࿥͞Εͨ಺༰ΛϦΞϧλΠϜͰߋ৽ͯ͘͠ΕΔ
17. ಡΈࠐΈ࣌ʹϦΞϧλΠϜDBͷ σʔλΛऔಘͯ͠ΦϒδΣΫτʹ อଘɻ VueͷςϯϓϨʔτͰඳըॲཧ Realtime DatabaseͷσʔλΛҰཡͰදࣔ͢Δ ϦΞϧλΠϜDBʹΞΠςϜ͕௥ Ճ͞Εͨ࣌ͷΠϕϯτΛݕ஌ͯ͠ ΦϒδΣΫτʹ௥Ճ ͉ ͉ ͉ σϑΥϧτͩͱɺ࠷৽ͷΞΠςϜ ͕Լʹདྷͯ͠·͏ͷͰɺฒͼΛٯ ʹͯ͠ฦ͢ॲཧ
18. ·ͱΊ w 0OTFO
    6*Λ࢖͑͹ΞϓϦͬΆ͍ݟͨ໨΍ڍಈ͕؆୯ ʹग़དྷΔ
    w .POBDB
    %FCVHFSͷϝχϡʔϘλϯ͸ಈ͘ʂ
    w 'JSFCBTF͸؆୯ʹσʔλͷొ࿥΍ಡΈࠐΈ͕Ͱ͖Δ ͷͰɺ؆୯ʹΞϓϦ։ൃΛ࢝ΊΒΕΔʂ
19. ͋Γ͕ͱ͏͍͟͝·ͨ͠ʂ