Skip to content
Permalink
Browse files

get users registered

  • Loading branch information...
galvez committed Apr 28, 2019
1 parent 66e4ee7 commit e51e31849fc358a5f20c6afa6bec8c1850bf6e6d
Showing with 145 additions and 37 deletions.
  1. +13 −0 api.js
  2. +20 −0 db.js
  3. +34 −0 layouts/default.vue
  4. +3 −0 middleware/auth.js
  5. +1 −0 package.json
  6. +6 −22 pages/index.vue
  7. +26 −0 pages/login.vue
  8. +0 −14 pages/protected.vue
  9. +36 −0 pages/register.vue
  10. +6 −1 store/index.js
13 api.js
@@ -1,4 +1,5 @@
import { json } from 'body-parser'
import { addUser } from './db'

export default [
{
@@ -11,5 +12,17 @@ export default [
(req, res, next) => {
res.json = (obj) => res.write(JSON.stringify(obj))
next()
},
{
path: '/api/users',
async handler(req, res, next) {
if (req.method === 'POST') {
await addUser(req.body)
res.json({ success: true })
res.end()
}
res.writeHead(403, 'Forbidden')
res.end()
}
}
]
20 db.js
@@ -0,0 +1,20 @@

import bcrypt from 'bcrypt'

function hashPassword(password) {
const salt = bcrypt.genSaltSync()
return new Promise((resolve) => {
bcrypt.hash(password, salt, (err, hash) => {
resolve(err ? null : hash)
})
})
}

const db = {
users: {}
}

export async function addUser(user) {
user.password = await hashPassword(user.password)
db.users[user.email] = user
}
@@ -0,0 +1,34 @@
<template>
<main>
<nuxt />
</main>
</template>

<style>
html, body, #__nuxt, #__layout {
font-size: 16px;
width: 100%;
height: 100%;
margin: 0px;
}
main {
width: 100%;
height: 100%;
margin: 0px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
}
main div {
display: flex;
flex-direction: column;
align-items: flex-start;
}
main input, main button {
outline: none;
display: block;
font-size: 16px;
margin-bottom: 5px;
}
</style>
@@ -1,2 +1,5 @@
export default function ({ store, route, redirect }) {
if (!store.state.user.authenticated) {
redirect('/register')
}
}
@@ -19,6 +19,7 @@
},
"dependencies": {
"@nuxt/http": "^0.1.1",
"bcrypt": "^3.0.6",
"body-parser": "^1.19.0"
}
}
@@ -1,30 +1,14 @@
<template>
<div class="login">
<input
placeholder="Email"
:value="form.email">
<input
placeholder="Password"
:value="form.password">
<button @click="login">
Login
</button>
<div>
Hello, {{ user.name }}!
</div>
</template>

<script>
import { mapState } from 'vuex'
export default {
data: () => ({
form: {}
}),
async asyncData({ app }) {
const response = await app.$http.get('api/ping')
return {
pongMessage: await response.text()
}
},
mounted() {
alert(this.pongMessage)
}
middleware: 'auth',
computed: mapState(['user'])
}
</script>
@@ -0,0 +1,26 @@
<template>
<div>
<h2>Login</h2>
<input
placeholder="Email"
:value="form.email">
<input
placeholder="Password"
:value="form.password">
<button @click="login">
Login
</button>
</div>
</template>

<script>
export default {
data: () => ({
form: {}
}),
methods: {
login() {
}
}
}
</script>

This file was deleted.

Oops, something went wrong.
@@ -0,0 +1,36 @@
<template>
<div>
<h2>Register</h2>
<input
placeholder="Name"
:value="form.name">
<input
type="email"
placeholder="Email"
:value="form.email">
<input
type="password"
placeholder="Password"
:value="form.password">
<button @click="register">
Register
</button>
</div>
</template>

<script>
export default {
data: () => ({
form: {}
}),
methods: {
async register() {
const jsonResponse = await
this.$http.$post('api/users', this.form)
if (jsonResponse.success) {
this.$router.push('/login')
}
}
}
}
</script>
@@ -1,3 +1,8 @@
export const state = () => ({

user: {
authenticated: false,
id: null,
email: null,
name: null
}
})

0 comments on commit e51e318

Please sign in to comment.
You can’t perform that action at this time.