const database = firebase.database()
const messagesRef = database.ref('messages')

data: {
  messages: [],
  messageText: '',
},

methods: {
  storeMessage() {
    messagesRef.push({text: this.messageText, name: this.name})
  },
  deleteMessage(message) {
    messagesRef.child(message.id).remove()
  },
}

//get real-time db entries on component creation
created() {
   messagesRef.on('child_added', snapshot => this.messagesArray.push(snapshot.val()))
}

//get real-time db entries on component creation AND its unique key
//value = snapshot.val() | key = snapshot.key
created() {
  messagesRef.on('child_added', snapshot => this.messagesArray.push({...snapshot.val(), id: snapshot.key}))
  messagesRef.on('child_removed', snapshot => {
    const deletedMessage = this.messages.find(message => message.id === snapshot.key)
    const index = this.messages.indexOf(deletedMessage)
    this.messages.splice(index, 1)
  })
}