firebase 연동

nuxt.config.js

@@ -61,6 +61,10 @@ export default {
     '/api/': {
       target: 'https://newsapi.org/v2/',
       pathRewrite: { '^/api/': '' }
+    },
+    '/register/': {
+      target: 'https://identitytoolkit.googleapis.com/v1/accounts:signUp?key=AIzaSyCYndjau99Ugi0BhT5THKDKhR5XTCv_zw4',
+      pathRewrite: { '^/register/': '' }
     }
   },
   env: {

pages/register/index.vue

@@ -1,3 +1,53 @@
 <template>
-  <p>register</p>
+  <div class="md-layout md-alignment-center-center" style="height: 100vh;">
+    <md-card class="md-layout-item md-size-50">
+      <md-card-header>
+        <div class="md-title">
+          Register
+        </div>
+      </md-card-header>
+
+      <form @submit.prevent="resisterUser">
+        <md-card-content>
+          <md-field md-clearable>
+            <label for="email">Email</label>
+            <md-input id="email" v-model="form.email" type="email" name="email" autocomplete="email"/>
+          </md-field>
+          <md-field>
+            <label for="password">password</label>
+            <md-input id="password" v-model="form.password" type="password" name="password" autocomplete="password" />
+          </md-field>
+        </md-card-content>
+
+        <md-card-actions>
+          <md-button to="/login">
+            Go To Login
+          </md-button>
+          <md-button class="md-primary md-raised" type="submit">
+            Submit
+          </md-button>
+        </md-card-actions>
+      </form>
+    </md-card>
+  </div>
 </template>
+
+<script>
+export default {
+  data: () => ({
+    form: {
+      email: '',
+      password: ''
+    }
+  }),
+  methods: {
+    async resisterUser () {
+      await this.$store.dispatch('authenticateUser', {
+        email: this.form.email,
+        password: this.form.password,
+        resturnSecureToken: true
+      })
+    }
+  }
+}
+</script>

store/index.js

@@ -28,6 +28,19 @@ const createStore = () => {
         const { articles } = await this.$axios.$get(apiUrl)
         commit('setLoading', false)
         commit('setHeadLines', articles)
+      },
+      async authenticateUser ({ commit }, userPayload) {
+        try {
+          commit('setLoading', true)
+          const autuUserData = await this.$axios.$post(
+            '/register/',
+            userPayload
+          )
+          console.log(autuUserData)
+          commit('setLoading', false)
+        } catch (error) {
+          console.log(error)
+        }
       }
     },
     getters: {