From 2dfdd2f45f8e4c989c0ffa73f352834fae084762 Mon Sep 17 00:00:00 2001
From: Raymonzut <40148684+Raymonzut@users.noreply.github.com>
Date: Thu, 23 Apr 2020 14:07:57 +0200
Subject: [PATCH 1/2] Add core-js for polyfills

---
 client/package-lock.json | 5 +++++
 client/package.json      | 1 +
 2 files changed, 6 insertions(+)

diff --git a/client/package-lock.json b/client/package-lock.json
index 491690b..bcec67f 100644
--- a/client/package-lock.json
+++ b/client/package-lock.json
@@ -3648,6 +3648,11 @@
         }
       }
     },
+    "core-js": {
+      "version": "3.6.5",
+      "resolved": "https://registry.npmjs.org/core-js/-/core-js-3.6.5.tgz",
+      "integrity": "sha512-vZVEEwZoIsI+vPEuoF9Iqf5H7/M3eeQqWlQnYa8FSKKePuYTf5MWnxb5SDAzCa60b3JBRS5g9b+Dq7b1y/RCrA=="
+    },
     "core-js-compat": {
       "version": "3.6.4",
       "resolved": "https://registry.npmjs.org/core-js-compat/-/core-js-compat-3.6.4.tgz",
diff --git a/client/package.json b/client/package.json
index 46887ba..4016028 100644
--- a/client/package.json
+++ b/client/package.json
@@ -21,6 +21,7 @@
   },
   "homepage": "https://github.com/Raymonzut/Personal-Website#readme",
   "dependencies": {
+    "core-js": "^3.6.5",
     "vue": "^2.6.11",
     "vue-resource": "^1.5.1"
   },

From 83a5d8a56cd6db4113a5dd258ef07f5061683779 Mon Sep 17 00:00:00 2001
From: Raymonzut <40148684+Raymonzut@users.noreply.github.com>
Date: Thu, 23 Apr 2020 14:12:07 +0200
Subject: [PATCH 2/2] Add the posts view

---
 client/src/views/posts.vue | 67 ++++++++++++++++++++++++++++++++++++++
 1 file changed, 67 insertions(+)
 create mode 100644 client/src/views/posts.vue

diff --git a/client/src/views/posts.vue b/client/src/views/posts.vue
new file mode 100644
index 0000000..5b2606b
--- /dev/null
+++ b/client/src/views/posts.vue
@@ -0,0 +1,67 @@
+<template>
+  <div id="posts" v-if="months.length >= 0">
+    <h3 class="month" v-for="(month, i) in months" :key="i">
+      {{ month }}
+      <div class="listAlign">
+        <ul>
+          <li v-for="(postItem, j) in getPostItems(month)" :key="j">
+            {{ getPostItemDate(postItem) }} – {{ postItem.title }}
+          </li>
+        </ul>
+      </div>
+      <br>
+    </h3>
+  </div>
+  <h2 v-else>There are no posts yet, but don't worry they will be added soon</h2>
+</template>
+
+<script>
+import { getPosts } from '../remote'
+
+export default {
+  name: "posts",
+  computed: {
+    months: function () {
+      const dates = this.posts.map(post => new Date(post.date))
+
+      // Contains the month followed by the year
+      const months = dates.map(date => `${date.toLocaleString('default', { month: 'long' })} ${date.getFullYear()}`)
+      const uniques = Array.from(new Set(months))
+
+      return uniques
+    }
+  },
+  data() {
+    return {
+      posts: []
+    }
+  },
+  methods: {
+    getPosts,
+    getPostItems: function (month) {
+      const month_index = new Date(`1 ${month}`).getMonth()
+      return this.posts.filter((post) => (new Date(post.date)).getMonth() === month_index)
+    },
+    getPostItemDate: function (postItem) {
+      const date = new Date(postItem.date)
+      return `${date.getFullYear()} ${date.toLocaleString('default', { month: 'short' })} ${date.getDate()}`
+    }
+  },
+  mounted() {
+    getPosts.call(this)
+  },
+}
+</script>
+
+<style scoped>
+ul {
+  text-align: left;
+}
+
+@media (min-width: 420px) {
+  .month {
+    text-indent: 1em;
+    text-align: left;
+  }
+}
+</style>
\ No newline at end of file