Migrated to nuxt-js frontend framework

frontend/components/LoginForm.vue

@@ -0,0 +1,61 @@
+<template>
+    <v-card flat>
+        <v-card-text>
+            <v-form
+                ref="form"
+                v-model="valid"
+                lazy-validation
+            >
+                <v-text-field
+                    v-model="username"
+                    :rules="usernameRules"
+                    label="Username"
+                    required
+                    prepend-icon="mdi-account"
+                ></v-text-field>
+
+                <v-text-field
+                    v-model="password"
+                    :rules="passwordRules"
+                    label="Password"
+                    required
+                    prepend-icon="mdi-lock"
+                    type="password"
+                ></v-text-field>
+
+            </v-form>
+        </v-card-text>
+        <v-card-actions>
+            <v-spacer/>
+            <v-btn
+                :disabled="!valid"
+                color="success"
+                @click="submit"
+            >
+                Login
+            </v-btn>
+        </v-card-actions>
+    </v-card>
+</template>
+
+<script>
+    export default {
+        name: "LoginForm",
+        methods: {
+            submit() {
+
+            }
+        },
+        data: () => ({
+            valid: false,
+            username: '',
+            usernameRules: [
+                v => !!v || 'Name is required',
+            ],
+            password: '',
+            passwordRules: [
+                v => !!v || 'Password is required',
+            ]
+        }),
+    }
+</script>

frontend/components/Note.vue

@@ -0,0 +1,55 @@
+<template>
+    <v-card height="100%">
+        <v-card-title>{{ title }}</v-card-title>
+        <v-card-text>
+            <slot></slot>
+        </v-card-text>
+
+        <div class="tags">
+            <v-chip v-for="tag in tags" :key="tag" active color="secondary">{{ tag }}</v-chip>
+        </div>
+
+        <v-divider class="mt-auto"></v-divider>
+
+        <v-card-actions>
+            <v-btn
+                text
+                color="deep-purple accent-4" dark>
+                <v-icon left>mdi-eye</v-icon>
+                View
+            </v-btn>
+            <v-spacer/>
+            <v-btn
+                text
+                color="deep-purple accent-4">
+                <v-icon left>mdi-pencil</v-icon>
+                Edit
+            </v-btn>
+        </v-card-actions>
+    </v-card>
+</template>
+
+<script>
+    export default {
+        name: "Note",
+        props: {
+            title: {
+                type: String,
+                required: true
+            },
+            tags: {
+                type: Array
+            }
+        }
+    }
+</script>
+
+<style>
+    .tags {
+        padding: 16px;
+    }
+
+    .tags .v-chip {
+        margin: 4px 8px 4px 0;
+    }
+</style>

frontend/components/RegisterForm.vue

@@ -0,0 +1,90 @@
+<template>
+    <v-card flat>
+        <v-card-text>
+            <v-form
+                ref="form"
+                v-model="valid"
+                lazy-validation
+            >
+                <v-text-field
+                    v-model="username"
+                    :rules="usernameRules"
+                    label="Username"
+                    required
+                    prepend-icon="mdi-account"
+                ></v-text-field>
+
+                <v-text-field
+                    v-model="email"
+                    :rules="emailRules"
+                    label="Email"
+                    required
+                    prepend-icon="mdi-at"
+                ></v-text-field>
+
+                <v-text-field
+                    v-model="password"
+                    :rules="passwordRules"
+                    label="Password"
+                    required
+                    prepend-icon="mdi-lock"
+                    type="password"
+                ></v-text-field>
+
+                <v-text-field
+                    v-model="confirm"
+                    :rules="confirmRules"
+                    label="Confirm your password"
+                    required
+                    prepend-icon="mdi-lock"
+                    type="password"
+                ></v-text-field>
+
+            </v-form>
+        </v-card-text>
+        <v-divider/>
+        <v-card-actions>
+            <v-spacer/>
+            <v-btn
+                :disabled="!valid"
+                color="success"
+                @click="submit"
+            >
+                Register
+            </v-btn>
+        </v-card-actions>
+    </v-card>
+</template>
+
+<script>
+    export default {
+        name: "RegisterForm",
+        methods: {
+            submit() {
+
+            }
+        },
+        data: () => ({
+            valid: false,
+            username: '',
+            usernameRules: [
+                v => !!v || 'Name is required',
+            ],
+            email: '',
+            emailRules: [
+                v => !!v || 'Email is required',
+                v => /.+@.+/.test(v) || 'E-mail must be valid',
+            ],
+            password: '',
+            passwordRules: [
+                v => !!v || 'Password is required',
+                v => v.length >= 6 || 'Password must be longer than 6 characters',
+            ],
+            confirm: '',
+            confirmRules: [
+                v => !!v || 'Password is required'
+                //v => confirmEquals() || 'Both passwords must be equals',
+            ]
+        }),
+    }
+</script>