Serhansolo

import firebase from "firebase/app";

const actions = {
  authAction({ commit }) {
    firebase.auth().onAuthStateChanged(user => {
      if (user) {
        commit("setUser", user);
      } else {
        commit("setUser", null);
      }

Serhansolo

<template>
  <div id="app">
    <navbar />
    <section v-if="isUserAuth" class="section">
      <div class="columns">
        <div class="column is-half is-offset-one-quarter">
          Welcome {{ getUser.email }}
        </div>
      </div>
    </section>

Serhansolo

<template>
  <nav class="navbar" role="navigation" aria-label="main navigation">
    <div class="navbar-brand" style="align-items: center;">
      <img
        src="https://vuejs.org/images/logo.png"
        style="height: 50px; margin: 20px;"
      />
      <span class="has-text-weight-medium is-size-4">
        Vue.js + Veux + Firebase = ❤️!
      </span>

Serhansolo

import firebase from "firebase/app";

const actions = {
  signUpAction({ commit }, payload) {
    firebase
      .auth()
      .createUserWithEmailAndPassword(payload.email, payload.password)
      .then(response => {
        commit("setUser", response.user);
      })

Serhansolo

import firebase from "firebase/app";

const actions = {
  signUpAction({ commit }, payload) {
    firebase
      .auth()
      .createUserWithEmailAndPassword(payload.email, payload.password)
      .then(response => {
        commit("setUser", response.user);
      })

Serhansolo

<template>
  <div class="columns" v-if="!isUserAuth">
    <div class="column is-half is-offset-one-quarter">
      <div class="card">
        <div class="card-content">
          <div
            v-if="validationErrors.length"
            class="notification is-danger is-light"
          >
            <button @click="resetError()" class="delete"></button>

Serhansolo

<template>
  <nav class="navbar" role="navigation" aria-label="main navigation">
    <div class="navbar-brand" style="align-items: center;">
      <img
        src="https://vuejs.org/images/logo.png"
        style="height: 50px; margin: 20px;"
      />
      <span class="has-text-weight-medium is-size-4">
        Vue.js + Veux + Firebase = ❤️!
      </span>

Serhansolo

<template>
  <div class="columns" v-if="!isUserAuth">
    <div class="column is-half is-offset-one-quarter">
      <div class="card">
        <div class="card-content">
          <div
            v-if="validationErrors.length"
            class="notification is-danger is-light"
          >
            <button @click="resetError()" class="delete"></button>

Serhansolo

<template>
  <div class="columns" v-if="!isUserAuth">
    <div class="column is-half is-offset-one-quarter">
      <div class="card">
        <div class="card-content">
          <div
            v-if="validationErrors.length"
            class="notification is-danger is-light"
          >
            <button @click="resetError()" class="delete"></button>

Serhansolo

<template>
  <div id="app">
    <navbar />
    <section v-if="isUserAuth" class="section">
      <div class="columns">
        <div class="column is-half is-offset-one-quarter">
          Welcome {{ getUser.email }}
        </div>
      </div>
    </section>