Firestoreをもっと手軽に使えるfirestore-simpleを作った

Firebase meetup #4
https://firebase-community.connpass.com/event/89302/

https://github.com/Kesin11/Firestore-simple

Transcript

1. FirestoreΛ΋ͬͱखܰʹ
   ࢖͑Δfirestore-simple
   Λ࡞ͬͨ
   Firebase Meetup #4
   @Kesin11
   

   View Slide

2. ࣗݾ঺հ
   • Twitter: @Kesin11
   • Github: Kesin11
   • ۀ຿Ͱ͸ςετͱ͔ࣗಈԽͱ͔
   • ࠷ۙͷͰ͖͝ͱ
   • TypeScript࢖͍࢝ΊͨΒ࠷ߴͩͬͨ
   

   View Slide

3. Firestoreͷ͍͍ͱ͜Ζ
   • ʢRealtimeDBͱͷൺֱ͸͠ͳ͍Ͱ͢ʣ
   • ݸਓͰ؆୯ͳαʔϏεΛ࡞Δ༻్ͳΒແྉͰ΋DBͷ༰ྔ΍ύ
   ϑΥʔϚϯεΛؾʹ͠ͳ͍͍ͯ͘
   • Herokuͷpostgresͷ1ສϨίʔυ੍ݶ͔Βͷ։์ʂʂ
   • αʔόʔ࣮૷ແ͠ͰDB΁ͷΞΫηε੍ݶ͕͔͚ΒΕΔ
   • ͋ΒΏΔ؀ڥ͔ΒΞΫηεͰ͖Δ
   • αʔόʔαΠυɺΫϥΠΞϯτΞϓϦɺCloud Function
   • ݴޠ͕มΘͬͯ΋API͕͍͍ͩͨಉ͡
   

   View Slide

4. ݴޠ͕มΘͬͯ΋API͕͍͍ͩͨಉ͡
   • ٯʹݴ͑͹࢖͍ͮΒ͍ͱ͜Ζ΋͋Δ
   • js͔Β࢖͍΍͍͢Α͏ʹ

   ຖճࣅͨΑ͏ͳϥούʔΛ࡞Γͦ͏ͳ༧ײ
   • ൚༻Խͯ͠ϥΠϒϥϦʹ͠Α͏
   

   View Slide

5. firestore-simple
   • https://github.com/Kesin11/Firestore-simple
   • js/TypeScript
   

   View Slide

6. ಛ௃
   

   View Slide

7. 1Πϯελϯε1ίϨΫγϣϯ
   • ຖճίϨΫγϣϯ΁ͷύεΛॻ͘ͷ͸ΊΜͲ͍͘͞
   • ඒ͘͠ͳ͍ͷͰ݁ہࣗ෼ͰίϨΫγϣϯ͝ͱͷ
   ModelͳͲΛ࡞Δ͜ͱʹͳΔ
   const firestore = admin.firestore()
   const collectionPath = 'users'
   await firestore.collection(collectionPath).add({ name: 'alice', age: 20 })
   await firestore.collection(collectionPath).add({ name: 'bob', age: 22 })
   const user_documents = await firestore.collection(collectionPath).get()
   ૉͷFirestore
   

   View Slide

8. 1Πϯελϯε1ίϨΫγϣϯ
   • ίϨΫγϣϯύεΛ౉ͯ͠ΠϯελϯεΛ࡞Δ
   • ຖճίϨΫγϣϯύεΛ౉͢ඞཁ͕ͳ͍
   const firestore = admin.firestore()
   const collectionPath = 'users'
   const dao = new FirestoreSimple(firestore, collectionPath)
   await dao.add({ name: 'alice', age: 20})
   await dao.add({ name: 'bob', age: 22 })
   firestore-simple
   

   View Slide

9. ී௨ͷObjectΛฦ͢
   • ϑΣονͨ͠υΩϡϝϯτͷத਎ɿ
   doc.data()
   • υΩϡϝϯτͷid: doc.id
   • όϥόϥͳͷͰ࢖͍উख͕͍·͍ͪ
   const doc = await firestore.collection(collectionPath).doc(id).get()
   const id = doc.id
   const name = doc.data().name
   ૉͷFirestore
   

   View Slide

10. ී௨ͷObjectΛฦ͢
    • ϑΣονͷ݁Ռ͸ී௨ͷObjectΛฦ͢
    • idͱͦΕҎ֎Ͱݺͼग़͠ํ͕ಉ͡
    • αϯϓϧίʔυͰ͸doc.id, doc.name
    • add΍setͰ΋ObjectΛฦ͢
    const doc = await dao.fetchDocument(id)
    // { id: 'XoZBjNpnj6QKCXSW4bu7', name: 'alice', age: 20 }
    const addedDoc = await dao.add({ name: ‘alice', age: 20})
    // { id: 'XoZBjNpnj6QKCXSW4bu7', name: 'alice', age: 20 }
    firestore-simple
    

    View Slide

11. ී௨ͷArrayΛฦ͢
    • ίϨΫγϣϯͷυΩϡϝϯτΛෳ਺ϑΣονͨ͠
    ৔߹͸forEach͔͠࢖͑ͳ͍
    • ໭Γ஋͸ArrayͰ͸ͳͯ͘QuerySnapshotͳͨΊ
    • map΍filter͕࢖͑ͳ͍ͷ͸͔ͳΓෆศ
    const userDocuments = await firestore.collection(collectionPath).get()
    const users = []
    userDocuments.forEach((document) => {
    const data = document.data()
    users.push({ id: document.id, name: data.name, age: data.age })
    })
    ૉͷFirestore
    

    View Slide

12. ී௨ͷArrayΛฦ͢
    • ෳ਺ϑΣονͨ͠৔߹͸ී௨ͷArrayΛฦ͢
    • mapͳͲ͕࢖͑ΔͷͰίʔυ͕εοΩϦ͢Δ
    const users = await dao.fetchCollection()
    // [ { id: '3mBYA0uXw0lw6b883jgk', age: 20, name: 'alice' },
    // { id: 'lE9SfP8f3H8w0Uwk0euQ', age: 22, name: 'bob' } ]
    const ids = users.map((user) => user.id)
    firestore-simple
    

    View Slide

13. ͱʹ͔͘js͔Βී௨ʹ

    ࢖͍΍͍͢Α͏ʹ͠·ͨ͠
    

    View Slide

14. ϝιουҰཡ
    • fetchDocument
    • fetchCollection
    • fetchByQueryʢwhere, order by, limitʣ
    • add
    • set
    • addOrSetʢfirestore-simpleΦϦδφϧʣ
    • delete
    • bulkSetʢbatchʹΑΔҰׅsetʣ
    • bulkDeleteʢbatchʹΑΔҰׅdeleteʣ
    

    View Slide

15. αϙʔτ͢Δ؀ڥ
    • TypeScript
    • firestore-simple͸TypeScript੡
    • nodejsʢαʔόʔαΠυʣ
    • ReactNativeʢReactNativeFirebaseʣ
    • Cloud Function
    • ࢼͯ͠ͳ͍͚Ͳϒϥ΢β༻jsΫϥΠΞϯτͰ΋ಈ͘
    ͔΋͠Εͳ͍Ͱ͢
    

    View Slide

16. αϙʔτ͍ͯ͠ͳ͍ػೳ
    • update
    • ߋ৽͸setͰे෼ͩͬͨͷͰ
    • τϥϯβΫγϣϯ
    • ࣮૷͕ෳࡶʹͳΓͦ͏ͩͬͨͷͰݟૹΓ
    • onSnapshot()
    • firestore-simpleͷΠϯελϯε಺ͷcollectionRefʹ͸ΞΫηεͰ͖
    ΔͷͰɺ΍Ζ͏ͱࢥ͑͹ී௨ʹՄೳ
    • ͨͩ͠ObjectΛฦ͞ͳ͍ͷͰૉͷFirestoreͱಉ͡ڍಈ
    • কདྷࣗ෼͕࢖͏Մೳੑ͕͋ΔͷͰɺͦͷͱ͖ʹαϙʔτ͢Δ͔΋ʁ
    

    View Slide

17. ·ͱΊ
    • FirestoreΛखܰʹ࢖͑Δfirestore-simpleΛ঺հ͠·ͨ͠
    • jsͰFirestore࢖͏ਓʹ͸Φεεϝ
    • ΋ͬͱৄ͍͠࢖͍ํ͸ϒϩάͱREADMEࢀর
    • http://kesin.hatenablog.com/entry/2018/06/12/095020
    • https://github.com/Kesin11/Firestore-simple
    • exampleʹαϯϓϧίʔυ͋Γ
    

    View Slide