Firestoreを利用したMAPアプリの開発について

by DaikiOKA

Slide 1

Slide 1 text

Caraquri Tech Night #4 FirestoreΛར༻ͨ͠MAPΞϓϦͷ։ൃʹ͍ͭͯ גࣜձࣾZERO TO ONE Ԭ େو

Slide 2

Slide 2 text

5XJUUFS*% !OPSJOPSJ@PLB Ԭେو • ৽ଔͰZERO TO ONEʹೖࣾ͠ɺ nori-naʹδϣΠϯ͢Δɻ • ࣾձਓ̏೥໨ࣾ಺།ҰͷΞϓϦΤ ϯδχΞ • iOS(Objective-CɺSwift)ɺ Android(JavaɺKotlin)ɺWebͱ αʔόʔ(CakePHPɺTypeScript) Ͱ։ൃ ࣗݾ঺հ DBSBRVSJ5FDI/JHIU

Slide 3

Slide 3 text

OPSJOBͱ͸ʁ ۭ੮ͷ͋ΔυϥΠόʔͱಉ͡ํ޲ʹҠಈ͍ͨ͠ਓΛ Ϛονϯάͤ͞Δ૬৐ΓʢϥΠυγΣΞʣαʔϏε DBSBRVSJ5FDI/JHIU

Slide 4

Slide 4 text

ϏδωεϞσϧ ૬৐Γ୅ ۭ੮ Ҡಈ͍ͨ͠ υϥΠόʔ ख਺ྉ DBSBRVSJ5FDI/JHIU

Slide 5

Slide 5 text

ΞϓϦͷྲྀΕ ໨త஍ ஍ਤɾ501 Ϛονϯά ϝοηʔδ DBSBRVSJ5FDI/JHIU

Slide 6

Slide 6 text

஍ਤը໘ͷઆ໌ ৽ண৘ใ ϥΠϒνϟοτ ৽ن࡞੒ ืूͷݕࡧ ۙ͘ͷϩάΠϯϢʔβʔΛ දࣔ ૬৐ΓͷϦΫΤετΛૹ৴ DBSBRVSJ5FDI/JHIU

Slide 7

Slide 7 text

OPSJOB 'JSFTUPSF $MPVEGVODUJPOT GPSpSFCBTF όοΫΤϯυ 'JSFCBTF nori-naͷγεςϜߏ੒ ໰͍߹Θͤ DBSBRVSJ5FDI/JHIU

Slide 8

Slide 8 text

ࠓ೔ͷ͓࿩ DBSBRVSJ5FDI/JHIU

Slide 9

Slide 9 text

Ґஔ৘ใΛར༻ͨ͠ΞϓϦ͕ ૿Ճ܏޲ DBSBRVSJ5FDI/JHIU

Slide 10

Slide 10 text

Ґஔ৘ใΛڞ༗͢Δ͜ͱʹ ఍߅ײ͕ͳ͘ͳ͖ͬͯͨ ஍ਤར༻࣮ଶௐࠪcגࣜձࣾθϯϦϯ DBSBRVSJ5FDI/JHIU

Slide 11

Slide 11 text

●έϞϯGO Z●nly Twit●er DBSBRVSJ5FDI/JHIU

Slide 12

Slide 12 text

چόʔδϣϯ ৽όʔδϣϯ ςΩετϕʔε Πϕϯτॏࢹ Ϛοϓϕʔε ϦΞϧλΠϜॏࢹ DBSBRVSJ5FDI/JHIU

Slide 13

Slide 13 text

ͳͥม͑ͨͷ͔ DBSBRVSJ5FDI/JHIU

Slide 14

Slide 14 text

چόʔδϣϯ ৽όʔδϣϯ ςΩετϕʔε Πϕϯτॏࢹ Ϛοϓϕʔε ϦΞϧλΠϜॏࢹ DBSBRVSJ5FDI/JHIU

Slide 15

Slide 15 text

ωΠςΟϒͷҙຯͳ͍ DBSBRVSJ5FDI/JHIU

Slide 16

Slide 16 text

MAPͰϦΞϧλΠϜʹ૬৐Γ DBSBRVSJ5FDI/JHIU

Slide 17

Slide 17 text

MAPϝΠϯͰؾ͍ͮͨ͜ͱ DBSBRVSJ5FDI/JHIU

Slide 18

Slide 18 text

Ϣʔβʔͷ཭୤཰͕௿͍ DBSBRVSJ5FDI/JHIU

Slide 19

Slide 19 text

Ұिؒޙͷ཭୤཰ چόʔδϣϯ 10~15% ৽όʔδϣϯ 20~35% ଟ͍࣌50% DBSBRVSJ5FDI/JHIU

Slide 20

Slide 20 text

ͳͥ DBSBRVSJ5FDI/JHIU

Slide 21

Slide 21 text

ϢʔβʔͷϦΞϧλΠϜͳಈ͖͕ ݟΕΔ͔Β DBSBRVSJ5FDI/JHIU

Slide 22

Slide 22 text

஌Βͳ͍ਓͰ΋࣮ࡍʹډΔͱ ҆৺͢Δ DBSBRVSJ5FDI/JHIU

Slide 23

Slide 23 text

FirebaseͷϦΞϧλΠϜੑΛ׆༻ • FirestoreΛར༻ • ΞΫςΟϒͳϢʔβʔҎ֎Λ ൒ಁ໌ • දࣔͯ͠ಈ͍͍ͯΔϢʔβʔ ͷಈ͖Λ௥͏ • Ͳͷ͘Β͍લʹىಈͨ͠ͷ͔ Θ͔Δ

Slide 24

Slide 24 text

• FirestoreΛར༻ • ΞΫςΟϒͳϢʔβʔҎ֎Λ ൒ಁ໌ • දࣔͯ͠ಈ͍͍ͯΔϢʔβʔ ͷಈ͖Λ௥͏ • Ͳͷ͘Β͍લʹىಈͨ͠ͷ͔ Θ͔Δ FirebaseͷϦΞϧλΠϜੑΛ׆༻

Slide 25

Slide 25 text

࢖༻ͨ͠MAP .BQ,JU (PPHMF.BQ ਌࿨ੑ σϑΥϧτ αʔυύʔςΟʔ ྉۚ ແྉ ैྔ੍ ܦ࿏දࣔ ͋Γ ͳ͠ ϝϞϦ গͳ͍ ଟ͍ MapKitͷศརͳ఺ ɾٯGeocodingɿҢ౓ܦ౓͔ΒॅॴΛऔಘՄೳ GoogleMapͷศརͳ఺ ɾετϦʔτϏϡʔ ɾ༗໊ͳ؍ޫ஍ͷ৘ใΛදࣔՄೳ DBSBRVSJ5FDI/JHIU

Slide 26

Slide 26 text

ϢʔβʔͷҐஔ৘ใ Firestore্ͷҰͭͷҐஔ৘ใΛߋ৽͠ଓ͚Δ →উखʹߋ৽ →ϦΞϧλΠϜͰϢʔβʔ͕ಈ͘ DBSBRVSJ5FDI/JHIU

Slide 27

Slide 27 text

໰୊఺ DBSBRVSJ5FDI/JHIU

Slide 28

Slide 28 text

ಈ࡞͕ॏ͘ͳΔ DBSBRVSJ5FDI/JHIU

Slide 29

Slide 29 text

ಈ࡞͕ॏ͘ͳΔݪҼ ঢ়گ දࣔ͢ΔϢʔβʔ͕ଟ͗͢Δʢ͓Αͦ300 ϢʔβʔΛ௒͑Δʣͱը໘͕ఀࢭ͍ͯ͠ ͨɻ ݪҼ ΞΠίϯը૾ͷαΠζ੍ݶΛ͔͚͍ͯͳ ͔ͬͨͨΊɺը૾ʹΑͬͯ͸ಡΈࠐΈʹ࣌ ͕͔͔ؒͬͨ

Slide 30

Slide 30 text

ຖճϢʔβʔΛಡΈࠐΉ JGMFUMBTU$FOUFS-PDBUJPOTFMGMBTU$FOUFS-PDBUJPO MBTU$FOUFS-PDBUJPOEJTUBODF UBSHFUMPDBUJPO TFMGNPWJOH5ISFTIPVME SPVUF%JTQMBZGBMTF\ NҎ্Ҡಈͨ͠Βɺߋ৽ TFMGSFMPBE"OOPUBUJPO MPDBUJPOMPDBUJPO SBEJVTNBQ6TFS*O ^FMTFJGTFMGMBTU$FOUFS-PDBUJPOOJMSPVUF%JTQMBZGBMTF\ ࠷ॳͷϩʔυ TFMGSFMPBE"OOPUBUJPO MPDBUJPOMPDBUJPO SBEJVTNBQ6TFS*O ^FMTFJGTFMGNBQ7JFXBOOPUBUJPOTDPNQBDU.BQ \BT 6TFS"OOPUBUJPO^ JT&NQUZ\ TFMGSFMPBE"OOPUBUJPO MPDBUJPOMPDBUJPO SBEJVTNBQ6TFS*O ^ DBSBRVSJ5FDI/JHIU

Slide 31

Slide 31 text

දࣔ͢ΔϢʔβʔΛ·ͱΊΔ JGNBQ7JFX[PPN-FWFMTFMGNBQ;PPN-FWFM5ISFTIPVME\ NBQ7JFXBOOPUBUJPOTGPS&BDI\BOOPUBUJPOJO JGMFUDMVTUFSBOOPUBUJPOBT .,$MVTUFS"OOPUBUJPO\ NBQ7JFXSFNPWF"OOPUBUJPO DMVTUFS DMVTUFSNFNCFS"OOPUBUJPOTGPS&BDI\ BOOPUBUJPO JO JGMFUBOOPUBUJPOBOOPUBUJPOBT %SJWFS"OOPUBUJPO\ NBQ7JFXSFNPWF"OOPUBUJPO BOOPUBUJPO ^ ^ NBQ7JFXBEE"OOPUBUJPOT DMVTUFSNFNCFS"OOPUBUJPOT ^ ^ ^ DBSBRVSJ5FDI/JHIU

Slide 32

Slide 32 text

࠷ޙʹ nori-na͸Hosting࢝Ί·ͨ͠ɻ DBSBRVSJ5FDI/JHIU

Slide 33

Slide 33 text

Hostingͱ͸ WebϖʔδΛެ։͢Δ࢓૊Έ ɾJavaScriptͷϑϨʔϜϫʔΫͰ͋Ε͹ͳΜͰ΋ྑ͍ ɾCloud Functionಉ༷πʔϧ͸npmܦ༝ͰΠϯετʔϧ ɾΞοϓϩʔυ΋Cloud Functionͱಉ༷ ɾ΋ͪΖΜFirestoreͷ৘ใΛදࣔՄೳ ɾnori-naͰ͸Vue.jsͰ࡞੒ DBSBRVSJ5FDI/JHIU

Slide 34

Slide 34 text

IUUQTTFBSDIOPSJOBKQ DBSBRVSJ5FDI/JHIU

Slide 35

Slide 35 text

IUUQTTFBSDIOPSJOBKQ DBSBRVSJ5FDI/JHIU

Slide 36

Slide 36 text

ͥͻ࢖ͬͯཉ͍͠ Cloud functions for Firebase

Slide 37

Slide 37 text

Cloud functions for ﬁrebaseͱ͸ 'JSFCBTFͷϢʔβೝূɺσʔλϕʔεͷ௥ՃͳͲͷΠϕϯτ Λड͚औͬͯॲཧΛߦ͏αʔϏε ݴޠɿ+BWB4DSJQUPS5ZQF4DSJQU 'JSFTUPSFτϦΨʔ w PO$SFBUF w PO6QEBUF w PO%FMFUF w PO8SJUF DBSBRVSJ5FDI/JHIU

Slide 38

Slide 38 text

nori-naͰͷར༻ํ๏ • ϓογϡ௨஌ • σʔλͷूܭ • ֎෦αʔϏεͱͷ࿈ܞ(ܾࡁɺݕࡧ) DBSBRVSJ5FDI/JHIU

Slide 39

Slide 39 text

ϓογϡ௨஌ onCreate export const pushRideshareRequest = functions.firestore .document(commonUtil.makePath('ridesharerequest/{requestId}')) .onCreate((snap, context) => { const newValue = new firestoreModels.RideShareRequest(snap.data()); const to = newValue.to; console.log(`push start ridesharerequest : ${context.params.requestId}`); return pushMessageByUserId(to, '૬৐Γґཔ͕ಧ͖·ͨ͠ɻ಺༰Λ֬ೝͯ͠ڐՄ͠·͠ΐ͏ɻ'); }); DBSBRVSJ5FDI/JHIU

Slide 40

Slide 40 text

ϓογϡ௨஌ onUpdate export const pushLikeComment = functions.firestore .document(commonUtil.makePath('mapcomment/{mapcommentId}')) .onUpdate((change, context) => { const afterData = new firestoreModels.MapComment(change.after.data()); const afterLike = afterData.likeMembers.length; const beforeData = new firestoreModels.MapComment(change.before.data()); const beforeLike = beforeData.likeMembers.length; const toUserId = afterData.user; if (!toUserId) return null; if (beforeLike < afterLike) { return pushMessageByUserId(toUserId, '͍͍Ͷ͕ԡ͞Ε·ͨ͠ʂ'); } return null; }); DBSBRVSJ5FDI/JHIU

Slide 41

Slide 41 text

ϩʔΧϧͰςετՄೳ $npm run shell DBSBRVSJ5FDI/JHIU

Slide 42

Slide 42 text

ςετίʔυ QVTI%FTUJOBUJPO6QEBUF \ CFGPSF\ TDSFFO/BNFVTF MPDBUJPO\ MBUJUVEF MPOHJUVEF ^ EFTUJOBUJPO\ OBNF5 HFP-PDBUJPO\ MBUJUVEF MPOHJUVEF ^ ^ ^ BGUFS\ TDSFFO/BNFVTFS MPDBUJPO\ MBUJUVEF MPOHJUVEF ^ EFTUJOBUJPO\ OBNF5PLZP5PXFS HFP-PDBUJPO\ MBUJUVEF MPOHJUVEF ^ ^ ^ ^ \ QBSBNT\ VTFS*EVTFS ^ ^ DBSBRVSJ5FDI/JHIU • beforeͱafterʹͦΕͧ ΕσʔλΛهड़ • params͸ඞཁͳ࣌ͷ Έ

Slide 43

Slide 43 text

Cloud Functionͷ৽ػೳ Scheduler export const cronRemindShare = functions.pubsub //.schedule("0 18 * * *")//ຖ೔18࣌ʹ࣮ߦ .schedule("every 5 minutes")//̑෼͓͖ .timeZone("Asia/Tokyo") .onRun(async context => { console.log("͜͜Ͱఆظ࣮ߦ") });

Slide 44

Slide 44 text

·ͱΊ Firebase+Map͸਌࿨ੑ͕ඇৗʹߴ͍ ϢʔβʔҐஔ৘ใΛϚοϓʹϦΞϧλΠϜදࣔ͢Δͱ݁ߏ໘ന͍ ͔ͦ͠͠ͷ··Ͱ͸ॲཧʹ໰୊ ରࡦ • දࣔ͢ΔൣғΛݶఆ • ଟ਺ͷϢʔβʔΛҰͭʹ·ͱΊΔ Webϖʔδ͸HostingͰ։ൃ͠Α͏ DBSBRVSJ5FDI/JHIU

Slide 45

Slide 45 text

͋Γ͕ͱ͏͍͟͝·ͨ͠