2年間Monacaで自社サービスを運用して学んだこと全部言います

Da5edcecfa8ee8c41813dd97a72e9203?s=47 nbfujiwara
October 03, 2017

 2年間Monacaで自社サービスを運用して学んだこと全部言います

第二回Monaca UGで発表した資料

Da5edcecfa8ee8c41813dd97a72e9203?s=128

nbfujiwara

October 03, 2017
Tweet

Transcript

  1. ೥ؒ.POBDBͰ ࣗࣾαʔϏεΛӡ༻ͯ͠ ֶΜͩ͜ͱશ෦ݴ͍·͢ .POBDB6(  Page.1

  2. ౻ݪ ༟࢘ גࣜձࣾχδϘοΫε ϓϨΠϯάϚωʔδϟతͳ࢓ࣄ 5ZQF 4DSJQU͕޷͖ લճ.POBDB6(ͷήʔϜσϞ͕޷ධʢͩͬͨ͸ͣʣ ϞφΧϓϨε IUUQTQSFTTNPOBDBJPNPOBDBVH ͔Βੋඇ͝ཡ͍ͩ͘͞

    ʢࠓ೔ͷ಺༰ͱ͸શવҧ͍·͢ʣ Page. 2 ࣗݾ঺հ
  3. 8FCϒϥ΢β൛ϦϦʔε .POBDBΞϓϦ൛ϦϦʔε Page. 3 ʮϨγϙʂʯϦϦʔε

  4. Page. 4 Ϩγϙͱ͸

  5. ϒϥ΢β൛ͷத͔Β ࠷খݶͷΑ͘࢖͏ϝΠϯػೳΛΞϓϦ൛ͱ࣮ͯ͠૷ Page. 5 ͸͡Ίͯͷ࣮Ҋ݅.POBDB։ൃ ϗʔϜ ͓஌Βͤ ձһԾొ࿥ ձһຊొ࿥ ձһ৘ใमਖ਼

    ϩάΠϯ ର৅঎඼Ұཡ ϨγʔτԠื ϙΠϯτ֬ೝ ৹ࠪ݁Ռ֬ೝ ϙΠϯτަ׵ '"2 ͓໰͍߹Θͤ ར༻ن໿ ϔϧϓ 4/4࿈ܞ ɾ ɾ ੺ࣈ͚ͩΛΞϓϦ൛Ͱ࣮૷ ͦͷଞ͸8FCͰ
  6. ࣌ؒͷۭ͍͍ͯͨΤϯδχΞʹ 3&45"1*Λ࡞੒ͯ͠΋Β͓͍ͬͯͨ ͍ͭͰʹυΩϡϝϯτ΋ ʢࣗՈ੡ͳΜͪΌͬͯ4XBHHFSʣ Page. 6 ͸͡Ίͯͷ࣮Ҋ݅.POBDB։ൃ

  7. ؔ܎ऀશһू·ͬͯ ʮ͓͞ΘΓձʯΛෳ਺ճ࣮ࢪ Page. 7 σόοΨʔ࢖͍΍͍͢ ͦͷ৔ͰҰؾʹย෇͚Δ 商品の表示は 一列?段組み? フェードイン・アウトの スピードはどれくらい?

    ここのマージン どれくらい? もうちょい遅く、 いや遅すぎ、 あーそれそれ 備考が短い時 表示が微妙だね
  8. Page. 8 ͦͷ݁Ռ

  9. ϤΧολϤΧολ ʘ ?P? ʗ Page. 9 ͸͡Ίͯͷ࣮Ҋ݅.POBDB։ൃ

  10. lΫϥ΢υ*%&্Ͱ։ൃ l0OTFO 6*YK2VFSZ lը໘ʢPOTQBHFʣ୯ҐͰ)5.-ɾ+4ɾ$44 ͸ͦΕͧΕ ϑΝΠϧͣͭʹʢಠཱੑॏࢹʣ l8FC։ൃͷϊϦͰ+4ϥΠϒϥϦΛར༻ l$ISPNF%FW5PPMT͕࢖͑Δ͜ͱʹײಈ Page. 10

    ͋ͷ࣌ͷॳظ։ൃΛࢥ͍ग़ͯ͠
  11. lΫϥ΢υ*%& ˠ .POBDB -PDBM,JU lίʔυ͸ࣾ಺(JU؅ཧ lόοΫΤϯυ"1*ͷ઀ଓઌΛ ։ൃαʔό ˠ ϩʔΧϧ7BHSBOU l(PPHMF"OBMZUJDTͰΠϕϯττϥοΫ

    Page. 11 ϦϦʔεޙ͙͢ʹ΍ͬͨ͜ͱ
  12. ͋Γ͕͍ͨ͜ͱʹԿ౓͔57Ͱ์ө ˠΞΫηεߴෛՙͰαʔό͕མͪΔ NPOBDBΞϓϦΛ࡞Δલ΋ޙ΋ Page. 12 <༨ஊ>ΞϓϦ൛Λ࡞ͬͯΑ͔ͬͨ

  13. ΞϓϦ͕͋ͬͨΒɺ์өཌ೔ͱ͔΋Ϣʔβొ࿥਺͕ ίϯελϯτʹ૿͑ͯ͘Εͨ Page. 13 <༨ஊ>ΞϓϦ൛Λ࡞ͬͯΑ͔ͬͨ アプリ後 アプリなかった時

  14. ΘΓͱେ͖ΊͳվमΛͨ͘͠ͳΔ lϢʔβొ࿥΋ΞϓϦͰʢػೳ௥Ճʣ lσβΠϯͷ࡮৽ Page. 14 ൒೥ޙ

  15. l"OHVMBSͷ࠾༻ –0OTFO6*ϕʔε –)5.-தʹ OH ΛάΠάΠຒΊࠐΈ –ը໘୯Ґ+4Λ ͦͷ··$POUSPMMFSʹͯ͠ –K2VFSZΛάΠάΠফͭͭ͠ –ϩδοΫΛ.PEFMͱ4FSWJDFʹ෼͚ͳ͕Β෼཭ l.POBDBGPS7JTVBM4UVEJPͰ։ൃ

    –ͨͩͷΞαΠϯΤϯδχΞͷ޷Έʢࠓ͸ར༻ͤͣʣ l௥Ճ࢓༷ͰᎍΊΔ΋࡞Γ௚ࣗ͠ମ͸εϜʔζ Page. 15 Ψϥοͱ࡞Γม͑
  16. Page. 16 σΟϨΫτϦߏ੒ DPOGJH ͦͷ໊ͷ௨Γ MJCωοτ͔ΒरͬͨϥΠϒϥϦ NPEFM.PEFM4FSWJDF NZMJC ࣗࣾ੡+4ϥΠϒϥϦʢ54ʣ QBHF$POUSPMMFS

  17. Page. 17 +4ϥΠϒϥϦ lQSFGJYGSFF – XFCLJU΄͛΄͛ͱ͔ॻ͘ͷ͕໘౗ͳͷͰ lNBTPOSZ – άϦουϨΠΞ΢τ lJNBHFTMPBEFE

    – ϩʔσΟϯάͷѻ͍Λָʹ l("-PDBM4UPSBHF – QIPOF(BQ༻("ϥούʔ lWBMJEBUF – ೖྗνΣοΫΛָʹ lODNC – /$.#ͷ"1*ΛݺͿͨΊ – ͜Ε͸.POBDBͷ+4$44ίϯϙʔωϯτ͔Β௥Ճ – QMVHJO௥ՃͰ࢖͏ͷ͸ʮXJOEPX/$.#NPOBDBIPHF ʯ ͬͪ͜͸ʮOFX/$.# ʯ
  18. Page. 18 DPOGJH಺Ͱ var module = angular.module('recipoApp'); //module.constant('SYSTEM_ENVIRONMENT', 'local'); //module.constant('SYSTEM_ENVIRONMENT',

    'development'); module.constant('SYSTEM_ENVIRONMENT', 'production'); switch (SYSTEM_ENVIRONMENT) { case 'local': config = { apiUrlBase:'https://local.recipo.jp/api/v2/', googleAnalyticsTrackingId: 'UA-xxxxxxxx-1', }; break; case 'development': config = { apiUrlBase:'https://dev.recipo.jp/api/v2/', googleAnalyticsTrackingId: 'UA-xxxxxxxx-1', ,,,, };
  19. ετΞʹ্͛ͨΞϓϦ͕ ։ൃαʔό޲͍ͯ·ͨ͠ ʘ ?P? ʗ Page. 19 ࣦഊ͢ΔՄೳੑͷ͋Δ΋ͷ͸ࣦഊ͢Δ

  20. ։ൃ؀ڥ·ΘΓͷ࿩ Page. 20 ଓ͖·ͯ͠

  21. جຊ-PDBM,JUΛ࢖༻ –ଞϓϩδΣΫτ͸ϝϯόʔ࣍ୈͰΫϥ΢υ*%&࢒ଘ –Ͳ͏΍ͬͨΒซ༻Ͱ͖ΔΜͩΖ͏ʁ ͨͩͷసૹπʔϧͱͯ͠࢖༻ ϓϨϏϡʔػೳ͸͋·Γ࢖Θͣ –.POBDBσόοΨʔ –ΧελϜϏϧυ൛.POBDBσόοΨʔ –ΞυϗοΫϏϧυ Ͱݕূɻ࢖͍෼͚ʹ׳Ε͕ඞཁ ʢ৽ϝϯόʔ͸࢖͍ॴΛ໎͍͕ͪʣ

    Ϋϥ΢υ*%&Ͱे෼ͱࢥ͍ͬͯͨ࣌΋͋Γ·ͨ͠ Ұ౓࢖͏ͱ΋͏཭ΕΒΕͳ͍ Page. 21 Ϋϥ΢υ*%& WT-PDBM,JU
  22. ΤσΟλ͸ϑϦʔμϜ FEJUPSDPOGJH͚ͩ͸ઃஔ Page. 22 ΤσΟλ [*] charset = utf-8 indent_style

    = space insert_final_newline = true trim_trailing_whitespace = true [*.{js,css}] end_of_line = crlf indent_size = 4
  23. IUUQTRJJUBDPNTPJDIJSP@OJTIJ[BXBJUFNTEFDDCE Page. 23 $*࠷ߴ

  24. HJU Ͱ NBTUFSʹQVTIͨ͠Β ͦͷ࣌఺ͰͷϏϧυΛϝϯόʔશһͷ୺຤ʹ഑෍ͯ͠ ΠΣʔʔʔΟΈ͍ͨͳ ݱࡏͰ͸.POBDB$*Λར༻ͯ͠ ετΞ΁ͷΞοϓϩʔυ·Ͱ͓·͔ͤ ಋೖલ͸ջٙతͰͨ͠ Ұ౓࢖͏ͱ΋͏཭ΕΒΕͳ͍ Page.

    24 $*࠷ߴ
  25. DPSEPWBQMVHJOTQMBTITDSFFO DPSEPWBQMVHJODBNFSB DPSEPWBQMVHJOJOBQQCSPXTFS DPSEPWBQMVHJOXIJUFMJTU DPSEPWBQMVHJOGJMF DPSEPWBQMVHJOBQQSBUF DPSEPWBQMVHJODSPTTXBMLXFCWJFX ODNCQVTINPOBDBQMVHJO DPSEPWBQMVHJOOJGUZQVTIJDPO DPSEPWBQMVHJOSFQSP

    Page. 25 Քಇத1MVHJO
  26. 1VTI௨஌ͷͨΊ͚ͩʹར༻ ϑϦʔͷൣғͰ͔ͳΓ࢖͑Δ .POBDBϢʔβ༻ͷ৘ใଟ͠ Page. 26 /JGUZ༷

  27. ೚ҙநग़ͨ͠Ϣʔβͷ࢖༻ঢ়گΛ ಈըͰอଘͯ͘͠ΕΔ αϙʔτ͕਌੾ $SPTTXBML͕ର৅֎Ͱ "OESPJE͸ਅͬ҉ಈը͕ଟ͍ Page. 27 3FQSP༷

  28. Page. 28 ͦͷଞͷ4%,ʢผΞϓϦʣ

  29. Ͳ͏ͬͯ͜ͱͳ͍मਖ਼Ͱ ͳ͔ͥΞϓϦ͕ϏϧυͰ͖ͳ͘ͳΔ Page. 29 4%,ࣄ݅

  30. $PSEPWB1MVHJOͷ63-ࢦఆ͸΍ΊΑ͏ Page. 30 4%,ࣄ݅ 1MVHJOຊՈͷ6QEBUF͕ىҼ ;*1 PS όʔδϣϯԘ௮͚ʹͨ͠ ผϦϙδτϦͷ63-ࢦఆ

  31. Page. 31 4%,ࣄ݅ 4%,͕ೖΒͳ͍ ·ͨ͸ ͳ͔ͥΞϓϦ͕མͪΔ ·ͨ͸ ଞ4%,ͱͷ߹ٕͤͰෆ۩߹

  32. Page. 32 4%,ࣄ݅ QMVHJOYNMͷ <framework src="com.google.android.gms:play- services-analytics:9.8.0" /> ίίΛٙ͏ʂ ʢશQMVHJOΛ௨ͯ͠ʣ

  33. Page. 33 4%,ࣄ݅ ͦΕͰ΋ ͜ͷઓ͍͸ऴΘΒͳ͍

  34. lCVJMEHSBEMF Λमਖ਼ɾ௥Ճͨ͠ lNPOBDBͷ9$PEFόʔδϣϯ΍$PSEPWBόʔδϣϯΛ֬ ೝͯ͠ɺ4%,ଆ͸ͪΐͬͱݹ͍΍ͭΛ࢖ͬͨ lQMVHJOYNMͰQMVHJOλάͷWFSTJPOΛʮʯ͔Β ʮʯʹม͑ͨ l΅ͦ࢒೦ͳ͕ΒఘΊͨ΅ͦ lमਖ਼ඞਢɻͦͷ··͍͚Ε͹ϥοΩʔ͙Β͍ͷؾ֓ Page. 34

    4%,ࣄ݅&9
  35. 4%,͸ଘࡏ͢Δ͕ $PSEPWB1MVHJO͸ଘࡏ͠ͳ͍৔߹ Page. 35 4%,໰୊

  36. NPOBDBΛ࢖Θͳ͍બ୒ࢶ΋ ߟྀͨ͠ํ͕͍͍ Page. 36 4%,໰୊

  37. lଞͷ$PSEPWB1MVHJOΛࢀߟ lτϥΠΤϥʔ lϏϧυ଴ͪ࣌ؒʹ଱͑Δ l$PSEPWBٕज़ऀΛ୳͢ lωΠςΟϒΞϓϦٕज़ऀΛ୳͢ Page. 37 4%,໰୊ 辛いが くぐり抜ければ

    マッチョになれる
  38. Page. 38 $SPTTXBMLʹ͍ͭͯ 標準WebView Crosswalk パフォーマンス 普通 早い (※いまいち実感しなかった り、誰かの端末で逆に重かっ

    たり) 端末依存 たくさんある 大変 少ない 嬉しい apkのサイズ 小さい 無駄に大きい
  39. Page. 39 $SPTTXBMLʹ͍ͭͯ 標準WebView Crosswalk パフォーマンス 普通 早い (※いまいち実感しなかった り、誰かの端末で逆に重かっ

    たり) 端末依存 たくさんある 大変 少ない 嬉しい apkのサイズ 小さい 無駄に大きい inAppBrowser 怪しくない 怪しい!!
  40. lηογϣϯपΓ͕ಛʹո͌͌͌͌͠ lʮϨγϙʂʯͷΑ͏ͳϒϥ΢β൛͋Γ͖ͷ΋ͷ͸Өڹ౓ ߹͍͕େ͖͍ lϒϥ΢β൛41දࣔͷͨΊʹɺ୺຤ґଘରԠ͸ผ్΍ͬͯ Δ lػೳʹΑͬͯ͸ΞϓϦ֎ϒϥ΢βʹಀ͛ͨΓ l$PSEPWBόʔδϣϯ΋Өڹ͢ΔͷͰɺະͩ݁࿦ग़ͣ Page. 40 $SPTTXBMLYJO"QQ#SPXTFS

  41. ݸਓతʹ͸ଟ͘ͷ৔߹ʮ$SPTTXBMLΛ࠾༻ʯ ͕ਖ਼ղͳؾ͕͢Δ Ͱ΋ɺαʔϏεࣗମ͕8FCϒϥ΢β൛΋ ؤு͍ͬͯΔ৔߹͸ɺݕ౼Λଓ͚ͨํ͕Α͍ Page. 41 $SPTTXBMLYJO"QQ#SPXTFS

  42. K2VFSZͰදݱ͢Δͱ Page. 42 ӡ༻ʹ͓͍ͯ $('.product_name').text(APIから取得した商品名); $('.product_name').html(APIから取得した商品名HTML); ౰ॳͷίʔυ ૿͍͑ͯ͘ίʔυ

  43. αʔόαΠυ͔Β7JFXΛૹΔؾ࣋ͪѱ͞͸͋Δ͕ ͜Ε͸ɺ.POBDBΞϓϦͷϝϦοτͰ΋͋Δؾ͕͢Δ ΉͪΌͪ͘ΌͰ͕͢ɺ௒ԠٸॲஔͰ TDSJQUλάಥͬࠐΜͩ͜ͱ΋͋Γ·͢ Page. 43 ӡ༻ʹ͓͍ͯ

  44. l1VTI௨஌ͷূ໌ॻ͕੾ΕͯͨΓ͢Δ l$PSEPWBΞοϓσʔτ͕དྷΔͷ͕ා͔ͬͨΓ͢Δ ෆఆظʹωΠςΟϒΤϯδχΞͰͳ͍ͱݫ͍͠λΠϛϯά ͕͋Δ Ͱ΋ɺωΠςΟϒͷ஌͕ࣝগͳ͍ϝϯόʔ͕୲౰ͩͬͨΓ ͢Δ Page. 44 ӡ༻ʹ͓͍ͯ

  45. ʢ4FMFOJVNͰ&&ςετΛճ͢ͱ͜Ζ·Ͱ͸΍ͬͨͷͰɺ/FYU4UFQʣ "QQJVNΛ࢖ͬͯ&&ςετʹνϟϨϯδத Page. 45 ࠓޙͷల๬

  46. -PXίετ .JEEMFΫΦϦςΟ ݟੵ΋Γ࣌ʹ͓͚ΔҰબ୒ࢶ ʮϒϥ΢βͳΒສɺ.POBDBͳΒສɺ ૉͷ"OESPJEJ04ͳΒສɺɺͲΕʹ͠·͢ʁʯ ϨγϙҎ߱ɺҊ݅Λ.POBDBͰ։ൃ σβΠφ্͕ΓͷϑϩϯτΤϯδχΞ΍ɺ৽ਓ͕ઓྗԽ͢Δͷ ͕ૣ͍ 1MVHJOͰࠔͬͨ࣌ɺࣗ਎Ͱ$PSEPWB΍9$PEFͰ΍Γͨ͘ͳΔ͕ɺ ΍ͬͨΒNPOBDBͷҙຯͳ͘ͳΔͱࢥ͍ɺ౿ΈͱͲ·Δ

    Page. 46 ฐࣾʹ͓͚Δ.POBDB
  47. ܦݧΛੵΜͩ5FDIࢤ޲ΤϯδχΞʹ͸ਓؾ͕ͳ͍ ʢ෺଍Γͳ͞ʹىҼʣ .POBDBࣗମͨͩͷπʔϧɻ׳Εෆ׳Εͦ͋͜Ε ֶͿඞཁͷ͋Δ΋ͷͰ͸ͳ͍ +4ΛΨγΨγॻ͍ͯ དྷΔ͔΋͠Εͳ͍ϒϥ΢βٯऻͷ࣌୅ʹඋ͓͑ͯ͘ Page. 47 ฐࣾʹ͓͚Δ.POBDB

  48. ͋Γ͕ͱ͏͍͟͝·ͨ͠ Page. 48 Ҏ্Ͱ͢