migrating to mongodb, adding blog, adding project links and tracked and much more

components/Navbar.vue

@@ -7,7 +7,7 @@
 			<NavbarLink :out="false" url="/">Home</NavbarLink>
 			<NavbarLink :out="false" url="/projects">Projects</NavbarLink>
 			<NavbarLink :out="false" url="/resources">Resources</NavbarLink>
-			<!--<NavbarLink :out="false" url="/stats">Stats</NavbarLink>-->
+			<NavbarLink :out="false" url="/blog">Blog</NavbarLink>
 			<NavbarLink :out="true" url="http://github.com/ngn13/ngn13.fun">Source</NavbarLink>
 		</div>
 	</nav>

components/NewPost.vue

@@ -0,0 +1,89 @@
+<template>
+    <main>
+        <h1>Add New Post</h1>
+        <div class="textareas">
+            <Input :keyup="function() { }" id="title" placeholder="Post Title" type="text"/>
+            <Input :keyup="function() { }" id="author" placeholder="Author" type="text"/>
+        </div>
+        <div class="textareas">
+            <textarea nor name="contenten" id="contenten" cols="30" rows="10" placeholder="Content (EN)"></textarea>
+            <textarea name="contenttr" id="contenttr" cols="30" rows="10" placeholder="Content (TR)"></textarea>
+        </div>
+        <Button :click="click">Post</Button>
+    </main>
+</template>
+
+<script>
+import axios from 'axios';
+import Input from './Input.vue';
+import Button from './Button.vue';
+
+export default {
+    methods: {
+        async click(e) {
+            const title = document.getElementById("title").value
+            const author = document.getElementById("author").value
+            const contenten = document.getElementById("contenten").value
+            const contenttr = document.getElementById("contenttr").value
+            const token = localStorage.getItem("token")
+            const res = await axios.post("/api/add_post", {
+                token: token,
+                title: title,
+                author: author,
+                content: {
+                    tr: contenttr,
+                    en: contenten
+                },
+            })
+            if(res.data["error"]!==0)
+                return alert("Error!")
+            alert("Post added!")
+            location.reload()
+        }
+    },
+}
+</script>
+
+<style scoped>
+h1{
+    color: var(--white);
+    font-size: 50px;
+    margin-bottom: 20px;
+    text-align: center;
+}
+
+textarea{
+    width: 500px;
+    font-size: 15px;
+    padding: 20px;
+    border-radius: 20px;
+    background: var(--dark-two);
+    border: none;
+    color: white;
+    outline: none;
+    resize: vertical;
+    height: 200px;
+    transition: .4s;
+}
+
+.textareas {
+    flex-direction: row;
+    display: flex;
+    gap: 20px;
+}
+
+textarea:focus {
+    box-shadow: var(--def-shadow);
+}
+
+main{
+    background-color: var(--dark-three);
+    padding: 50px;
+    margin-top: 50px;
+    display: flex;
+    flex-direction: column;
+    gap: 20px;
+    align-items: center;
+    justify-content: center;
+}
+</style>

components/PostPreview.vue

@@ -0,0 +1,42 @@
+<template>
+<nuxt-link :to="url">
+    <h1>{{ title }}</h1>
+    <p>{{ info }}</p>
+    <h2>{{ desc }}</h2> 
+</nuxt-link>
+</template>
+
+<script>
+export default {
+    props: ["title", "desc", "info", "url"],
+}
+</script>
+
+<style scoped>
+a{
+    padding: 30px;
+    color: white;
+    background: var(--dark-two);
+    cursor: pointer;
+    text-decoration: none;
+    transition: .4s;
+    width: 70%;
+}
+
+a:hover{
+    box-shadow: var(--def-shadow);
+}
+
+h1{
+    font-size: 40px;
+    margin-bottom: 5px;
+    animation-name: colorAnimation;
+    animation-iteration-count: infinite;
+    animation-duration: 10s;
+    text-shadow: none;
+}
+
+h2{
+    margin-top: 10px;
+}
+</style>

components/Project.vue

@@ -13,7 +13,7 @@ export default {
     props: ["name", "desc", "url"],
     methods: {
         redirect(e) {
-            location.href = this.url
+            location.href=this.url
         }
     },
 }