Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Firestoreを実装してみた話

8fb8810e5e06a997bc13831b9b51007f?s=47 keinuma
January 05, 2021
29

 Firestoreを実装してみた話

8fb8810e5e06a997bc13831b9b51007f?s=128

keinuma

January 05, 2021
Tweet

Transcript

  1. Firestore を してみた 2021/1/5 沼⽥ 1 / 16

  2. ⽇ すこと Firestore とは クライアントによるFirestore の使い Firestore を 慮したクライアントの 2

    / 16
  3. Firestore とは NoSQL データベース 他のNoSQL に べてリレーション、クエリが柔 Web, Mobile 3

    / 16
  4. Firestore のデータ構 4 / 16

  5. Firestore のデータ構 Collection がRDB のテーブル Document がレコード Collection をネストしたSubcollection 作れる

    5 / 16
  6. Firestore の使い 照 Collection と 件を指 して 索 更 を

    知できる ・更 Document 単 で 6 / 16
  7. 照 import * as firebase from 'firebase/app' const firestore =

    firebase.firestore() const collection = firestore.collection('messages') collection .where('uids', 'array-contains', 'xxxx-xxx-xxx') .get() .then((document) => { const data = document.data() console.log(data) }) 7 / 16
  8. 照( 更を 知) const firestore = firebase.firestore() const collection =

    firestore.collection('messages') const unsubscribe = collection .where('uids', 'array-contains', 'xxxx-xxx-xxx') .onSnapshot() .then((snapshot) => { const data = snapshot.data() console.log(data) }) window.addEventListener('unload', unsubscribe) 8 / 16
  9. const firestore = firebase.firestore() const collection = firestore.collection('messages') collection.doc('xxxx-xxx-xxx').set({ text:

    'hogehoge' }) 9 / 16
  10. Firestore からデータ構 を する Collection はFirestore のデータとアプリのデータを できる データの は双

    向で 義する 10 / 16
  11. const converter = { toFirestore(messageModel) { return { ...messageModel, updatedAt:

    firestore.Timestamp.fromDate(messageModel.updatedAt) } }, fromFirestore(snapshot) { const messageData = snapshot.data() return new MessageModel({ ...messageData, updatedAt: messageData.updatedAt.toDate() }) } } const convertCollection = collection.withConverter(converter) 11 / 16
  12. Firestore の Firestore に するメソッドをラップしてClass Converter はアプリのデータ構 とFirestore 知って いるため

    けて 12 / 16
  13. 13 / 16

  14. Firestore のメソッドをラップ class FirestoreRepository { private readonly collection constructor(path, converter)

    { this.collection = db.collection(path) .withConverter(converter) } subscribeById(id, callback) { return this.collection.doc(id).onSnapshot( (snapshot) => callback(snapshot.data()) ) } } 14 / 16
  15. ドメイン別に を 義 const converter = { toFirestore(messageModel) { ...

    }, fromFirestore(snapshot) { ... } } const MessagesRepository = new FirestoreRepository( 'messages', converter ) 15 / 16
  16. まとめ Firestore はデータ のオプション(Converter) がある Firestore のメソッドをRepository してConverter を け

    て すると責 を 離できる 16 / 16