Authentification demo with VueFire

auth-demo.js

  // Initialize Firebase
    firebase.database.enableLogging(false) // toggle on for debug (it's noisy)
    var db = firebase.initializeApp({
      apiKey: "AIzaSyDSdRWUWjx55Yf9_SCaW23_HTGhUrvE6qw",
      authDomain: "vuefire-auth-example.firebaseapp.com",
      databaseURL: "https://vuefire-auth-example.firebaseio.com",
      storageBucket: "vuefire-auth-example.appspot.com",
      messagingSenderId: "925981907667"
    }).database();

    new Vue({
      el: '#app',
      beforeCreate: function() {

        // Setup Firebase onAuthStateChanged handler
        //
        // https://firebase.google.com/docs/reference/js/firebase.auth.Auth
        // https://firebase.google.com/docs/reference/js/firebase.auth.Auth#onAuthStateChanged
        firebase.auth().onAuthStateChanged(function(user) {
          if (user) {
            this.user = user
            // https://github.com/vuejs/vuefire/blob/master/src/vuefire.js#L169
            this.$bindAsArray('messages', db.ref('messages/' + user.uid))
          } else {
            // https://firebase.google.com/docs/reference/js/firebase.auth.Auth#signInAnonymously
            firebase.auth().signInAnonymously().catch(console.error)
          }
        }.bind(this))

      },

      // Initialize reactive props, bind later when user is available
      data: {
        user: {},
        messages: []
      },

      // Demo add/remove to show it all works
      methods: {
        addMessage: function() {
            // https://firebase.google.com/docs/reference/js/firebase.database.Reference#push
            this.$firebaseRefs.messages.push({
                text: 'new message', timestamp: Date() })
        },
        removeMessage: function(message) {
            // https://firebase.google.com/docs/reference/js/firebase.database.Reference#remove
            this.$firebaseRefs.messages.child(message['.key']).remove()
        }
      }

    })