¿Qué es Firebase Auth?

• Como veíamos antes, la mayoría de proyectos necesitan algún tipo de autenticación.
• Puedes construirlo tú mismo/a (en ocasiones si el proyecto lo exige esa es la solución a seguir) o puedes utilizar un servicio externo para que cumpla esa función integrándolo en tu proyecto. Firebase Auth es perfecto para esta tarea. Es sencillo de utilizar y muy potente.
• Como ves permite utilizar proveedores sociales como Google, Facebook, GitHub y demás. Incluso autentificación con número de teléfono.
• Además incluye una serie de componentes llamados Firebase UI para integrar todo el flujo de de acceso de tu aplicación. En el curso no lo usaremos, sino que haremos toda la integración de forma manual.
• Por ejemplo, antes de comenzar a integrar Firebase Auth en VueTalk vamos a poner a prueba el proveedor social de Google.
• Primero, debemos ir a la consola de Firebase, seleccionar nuestro proyecto creado anteriormente, hacer click en "Authentication" y activar al menos un método de inicio de sesión. Por ahora, Google.
• Ahora, de nuevo en la documentación, vamos al apartado Web y proveedor Google para seguir las instrucciones, aunque utilizando el wrapper async/await en lugar de Promises.
• Por ejemplo, en nuestro Home.vue podemos crear dos métodos locales para hacer login y logout con Google. Primero, creando un nuevo proveedor con new firebase.auth.GoogleAuthProvider y luego usándolo para crear un nuevo popup de Auth con signInWithPopup.

// Home.vue
methods: {
  async doLogin() {
    try {
      const provider = new fb.auth.GoogleAuthProvider();
      const user = await auth.signInWithPopup(provider);
    } catch (error) {
      console.error(error.message);
    }
  },
  async doLogout() {
    try {
      await auth.signOut();
    } catch (error) {
      console.error(error.message);
    }
  }
}

• Al ponerlo en práctica verás como el usuario se ha creado en la consola Auth de Firebase. Podemos crear un saludo personalizado utilizando la propiedad displayName.
• Por supuesto hay mucho más que hacer, como por ejemplo utilizar algún tipo de persistencia ya que al refrescar el navegador perdemos el estado de autentificación. Sin embargo el objetivo de esta lección era mostrarte en esencia cómo funciona Firebase Auth.
• En la siguiente lección empezaremos a implementar un sistema de autentifcación completo basado en usuario y contraseña y centralizado en su própio módulo de Vuex.