diff --git a/.eslintrc.js b/.eslintrc.js
deleted file mode 100644
index cf390c3..0000000
--- a/.eslintrc.js
+++ /dev/null
@@ -1,16 +0,0 @@
-module.exports = {
-  root: true,
-  env: {
-    browser: true,
-    node: true
-  },
-  parserOptions: {
-    parser: 'babel-eslint'
-  },
-  extends: [
-    '@nuxtjs',
-    'standard'
-  ],
-  // add your custom rules here
-  rules: {}
-}
diff --git a/api/posts.js b/api/posts.js
new file mode 100644
index 0000000..22e2c10
--- /dev/null
+++ b/api/posts.js
@@ -0,0 +1,20 @@
+import axios from 'axios'
+
+export default {
+  async bySha (sha) {
+    const { data } = await axios.get(`https://api.github.com/repos/mhgbrown/nuxt-ghpages-blog-content/git/blobs/${sha}?access_token=${process.env.GITHUB_TOKEN}`)
+    return data
+  },
+  async all () {
+    const postsPath = 'posts/'
+    const url = `https://api.github.com/repos/mhgbrown/nuxt-ghpages-blog-content/git/trees/master?recursive=1&access_token=${process.env.GITHUB_TOKEN}`
+    const { data } = await axios.get(url)
+    return data.tree.reduce((memo, node) => {
+      if (node.path.startsWith(postsPath)) {
+        memo.push(node)
+      }
+
+      return memo
+    }, [])
+  }
+}
diff --git a/assets/README.md b/assets/README.md
deleted file mode 100644
index 34766f9..0000000
--- a/assets/README.md
+++ /dev/null
@@ -1,7 +0,0 @@
-# ASSETS
-
-**This directory is not required, you can delete it if you don't want to use it.**
-
-This directory contains your un-compiled assets such as LESS, SASS, or JavaScript.
-
-More information about the usage of this directory in [the documentation](https://nuxtjs.org/guide/assets#webpacked).
diff --git a/components/README.md b/components/README.md
deleted file mode 100644
index a079f10..0000000
--- a/components/README.md
+++ /dev/null
@@ -1,7 +0,0 @@
-# COMPONENTS
-
-**This directory is not required, you can delete it if you don't want to use it.**
-
-The components directory contains your Vue.js Components.
-
-_Nuxt.js doesn't supercharge these components._
diff --git a/models/post.js b/models/post.js
new file mode 100644
index 0000000..1afa7ae
--- /dev/null
+++ b/models/post.js
@@ -0,0 +1,43 @@
+import postsClient from '../api/posts'
+
+class Post {
+  static async all () {
+    const rawPosts = await postsClient.all()
+    return rawPosts.map(rawPost => this._fromNode(rawPost))
+  }
+
+  static async bySha (sha) {
+    const rawPost = await postsClient.bySha(sha)
+    return this._fromBlob(rawPost)
+  }
+
+  static _fromNode (node) {
+    const post = new this(node)
+    const pathPrefix = 'posts/'
+    post.name = node.path.replace(pathPrefix, '')
+    post.title = this._extractTitle(post.name)
+    post.date = this._extractDate(post.name)
+    return post
+  }
+
+  static _fromBlob (blob) {
+    const post = new this(blob)
+    post.content = ''
+    return post
+  }
+
+  static _extractTitle (name) {
+    return name.replace(/\.md$/, '')
+      .replace(/^\d{4}-\d{1,2}-\d{1,2}-/, '')
+  }
+
+  static _extractDate (name) {
+    return /^\d{4}-\d{1,2}-\d{1,2}/.exec(name)[0]
+  }
+
+  constructor (nodeOrBlob) {
+    this.sha = nodeOrBlob.sha
+  }
+}
+
+export default Post
diff --git a/nuxt.config.js b/nuxt.config.js
index cb21b27..dc19731 100644
--- a/nuxt.config.js
+++ b/nuxt.config.js
@@ -1,8 +1,8 @@
-const VuetifyLoaderPlugin = require('vuetify-loader/lib/plugin')
-const axios = require('axios')
-const pkg = require('./package')
+import VuetifyLoaderPlugin from 'vuetify-loader/lib/plugin'
+import pkg from './package'
+import Post from './models/post'
 
-module.exports = {
+export default {
   mode: 'universal',
 
   /*
@@ -51,26 +51,28 @@ module.exports = {
     '@nuxtjs/axios'
   ],
 
+  /*
+  ** Environment variables to inject
+  */
+  env: {
+    GITHUB_TOKEN: process.env.GITHUB_TOKEN
+  },
+
   /**
    * Static generation configuration
    */
   generate: {
+    interval: 100,
+
     async routes () {
       try {
-        const postsDirectory = 'posts/'
-        const url = `https://api.github.com/repos/mhgbrown/nuxt-ghpages-blog-content/git/trees/master?recursive=1&access_token=${process.env.GITHUB_TOKEN}`
-        const response = await axios.get(url)
-        return response.data.tree.reduce((memo, node) => {
-          if (node.path.startsWith(postsDirectory)) {
-            // NB: route is actually the same as node.path in my case
-            memo.push({
-              route: `/posts/${node.sha}`,
-              payload: node
-            })
+        const posts = await Post.all()
+        return posts.map((post) => {
+          return {
+            route: `/posts/${post.sha}`,
+            payload: post
           }
-
-          return memo
-        }, [])
+        })
       } catch (error) {
         // eslint-disable-next-line no-console
         console.error(error.response)
diff --git a/package-lock.json b/package-lock.json
index 7d8c0e3..d56cb8f 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1416,8 +1416,7 @@
     "abab": {
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/abab/-/abab-2.0.0.tgz",
-      "integrity": "sha512-sY5AXXVZv4Y1VACTtR11UJCPHHudgY5i26Qj5TypE6DKlIApbwb5uqhXcJ5UUGbvZNRh7EeIoW+LrJumBsKp7w==",
-      "dev": true
+      "integrity": "sha512-sY5AXXVZv4Y1VACTtR11UJCPHHudgY5i26Qj5TypE6DKlIApbwb5uqhXcJ5UUGbvZNRh7EeIoW+LrJumBsKp7w=="
     },
     "abbrev": {
       "version": "1.1.1",
diff --git a/package.json b/package.json
index c94830a..cee2ea7 100644
--- a/package.json
+++ b/package.json
@@ -16,6 +16,7 @@
   },
   "dependencies": {
     "@nuxtjs/axios": "^5.3.6",
+    "abab": "^2.0.0",
     "cross-env": "^5.2.0",
     "gray-matter": "^4.0.2",
     "highlightjs": "^9.12.0",
diff --git a/pages/README.md b/pages/README.md
deleted file mode 100644
index 1d5d48b..0000000
--- a/pages/README.md
+++ /dev/null
@@ -1,6 +0,0 @@
-# PAGES
-
-This directory contains your Application Views and Routes.
-The framework reads all the `*.vue` files inside this directory and creates the router of your application.
-
-More information about the usage of this directory in [the documentation](https://nuxtjs.org/guide/routing).
diff --git a/pages/index.vue b/pages/index.vue
index e150d0d..82a12de 100644
--- a/pages/index.vue
+++ b/pages/index.vue
@@ -9,12 +9,25 @@
       sm8
       md6
     >
-    Hello!
+      <h1>My Posts</h1>
+      <ul>
+        <li v-for="post in posts" :key="post.sha">
+          <router-link :to="{ name: 'posts-id', params: { id: post.sha } }">{{ post.title }}</router-link>
+        </li>
+      </ul>
     </v-flex>
   </v-layout>
 </template>
 
 <script>
+import Post from '@/models/post'
+
 export default {
+  async asyncData () {
+    const posts = await Post.all()
+    return {
+      posts
+    }
+  }
 }
 </script>
diff --git a/pages/posts/_id.vue b/pages/posts/_id.vue
index f5db459..3daa4dc 100644
--- a/pages/posts/_id.vue
+++ b/pages/posts/_id.vue
@@ -9,21 +9,67 @@
       sm8
       md6
     >
-    {{ post.sha }}
+      <p>{{ matter.data.title }}</p>
+      {{matter}}
     </v-flex>
   </v-layout>
 </template>
 
 <script>
+import Post from '@/models/post'
+import * as matter from 'gray-matter'
+import Remarkable from 'remarkable'
+import hljs from 'highlightjs'
+import { atob } from 'abab'
+
+// MDN sourced function to properly decode chinese, etc characters
+function b64DecodeUnicode (str) {
+  // Going backwards: from bytestream, to percent-encoding, to original string.
+  return decodeURIComponent(atob(str).split('').map(function (c) {
+    return '%' + ('00' + c.charCodeAt(0).toString(16)).slice(-2)
+  }).join(''))
+}
+
+// Actual default values
+const md = new Remarkable({
+  highlight (str, lang) {
+    if (lang && hljs.getLanguage(lang)) {
+      try {
+        return hljs.highlight(lang, str).value
+      } catch (err) {}
+    }
+
+    try {
+      return hljs.highlightAuto(str).value
+    } catch (err) {}
+
+    return '' // use external default escaping
+  }
+})
+
 export default {
-  asyncData ({ params, error, payload }) {
-    if (payload) {
+  async asyncData ({ params, error, payload }) {
+    try {
+      const post = await Post.bySha(params.id)
       return {
-        post: payload
+        post
       }
+    } catch (error) {
+      // eslint-disable-next-line no-console
+      console.error(error.response)
+      throw error
+    }
+  },
+  computed: {
+    decodedContent () {
+      return b64DecodeUnicode(this.post.content)
+    },
+    matter () {
+      return matter(this.decodedContent)
+    },
+    html () {
+      return md(this.matter.content)
     }
-
-    throw new Error('No payload')
   }
 }
 </script>
diff --git a/plugins/README.md b/plugins/README.md
deleted file mode 100644
index ca1f9d8..0000000
--- a/plugins/README.md
+++ /dev/null
@@ -1,7 +0,0 @@
-# PLUGINS
-
-**This directory is not required, you can delete it if you don't want to use it.**
-
-This directory contains Javascript plugins that you want to run before mounting the root Vue.js application.
-
-More information about the usage of this directory in [the documentation](https://nuxtjs.org/guide/plugins).
diff --git a/static/README.md b/static/README.md
deleted file mode 100644
index 3fc5002..0000000
--- a/static/README.md
+++ /dev/null
@@ -1,10 +0,0 @@
-# STATIC
-
-**This directory is not required, you can delete it if you don't want to use it.**
-
-This directory contains your static files.
-Each file inside this directory is mapped to `/`.
-
-Example: `/static/robots.txt` is mapped as `/robots.txt`.
-
-More information about the usage of this directory in [the documentation](https://nuxtjs.org/guide/assets#static).
diff --git a/store/README.md b/store/README.md
deleted file mode 100644
index 1972d27..0000000
--- a/store/README.md
+++ /dev/null
@@ -1,10 +0,0 @@
-# STORE
-
-**This directory is not required, you can delete it if you don't want to use it.**
-
-This directory contains your Vuex Store files.
-Vuex Store option is implemented in the Nuxt.js framework.
-
-Creating a file in this directory automatically activates the option in the framework.
-
-More information about the usage of this directory in [the documentation](https://nuxtjs.org/guide/vuex-store).