Connecting the Vuex store to the Firebase database

So, now we have to connect our Vuex store to the Firebase database. We could use the native Firebase API for binding the state data to the database data, but why would we deal with promises and stuff if someone already did that for us? This someone is called Eduardo and he has created Vuexfire – Firebase bindings for Vuex (https://github.com/posva/vuexfire). If you were at the vueconf2017 conference in Wroclaw, you probably remember this guy:

Eduardo talking about Vue and Firebase during the Vue conference

Vuexfire comes with Firebase mutations and actions that will do all the behind the scenes jobs for you, while you just export them within your mutations and actions objects. So, to start with, install both firebase and vuexfire:

npm install vue firebase vuexfire –save

Import firebase and firebaseMutations in your store's index.js entry point:

//store/index.js
import firebase from 'firebase'
import { firebaseMutations } from 'vuexfire'

Now...