Started mocking API

src/components/HelloWorld.vue

@@ -5,7 +5,7 @@ defineProps<{ msg: string }>()
 
 const count = ref(0)
 
-fetch('/api/users').then(res => res.json()).then(res => console.log(res))
+fetch('/api/v1/sections').then(res => res.json()).then(res => console.log(res))
 </script>
 
 <template>

src/main.ts

@@ -1,7 +1,7 @@
 import { createApp } from 'vue'
 import App from './App.vue'
 // @ts-ignore
-import { makeServer } from './server'
+import { makeServer } from './mirage/v1'
 
 if (import.meta.env.DEV) {
   makeServer()

src/mirage/models.js

@@ -0,0 +1,52 @@
+export const sections = [
+  {
+    id: '837ba6a5-47ed-4682-bff5-90bc5c5f9646',
+    title: 'Section One',
+    shortname: 'one',
+    description: 'The first section.',
+    is_default: true,
+    has_titles: true,
+    is_private: false,
+    is_archived: false
+  },
+  {
+    id: '5e661b3f-61e6-4aed-a93b-8cae0896f656',
+    title: 'Section Two',
+    shortname: 'two',
+    description: 'The second section.',
+    is_default: true,
+    has_titles: false,
+    is_private: false,
+    is_archived: false
+  },
+  {
+    id: '5fcbeaca-1496-438e-ace2-18e99e11f384',
+    title: 'Section Three',
+    shortname: 'three',
+    description: 'The third section.',
+    is_default: false,
+    has_titles: true,
+    is_private: false,
+    is_archived: false
+  }
+];
+
+export const posts = [
+  {
+    id: 'af08bbcd-f6eb-446e-b355-13e0a0ef008e',
+    section_id: sections[0]['id'],
+    is_private: false,
+    is_archived: false
+  }
+];
+
+export const versions = [
+  {
+    id: '8c5bc2f9-e52f-4e19-bd76-119cc42ff863',
+    post_id: posts[0]['id'],
+    title: 'This Is A Title',
+    publish_date: '2021-12-28',
+    content: 'Hello. This is some content!',
+    is_draft: false
+  }
+]

src/mirage/v1.js

@@ -0,0 +1,37 @@
+import { createServer, Model } from 'miragejs';
+import { sections, posts, versions } from './models';
+
+export function makeServer ({ environment = 'development' } = {}) {
+  const server = createServer({
+    environment,
+
+    models: {
+      section: Model,
+      Post: Model,
+      version: Model
+    },
+
+    seeds (server) {
+      sections.forEach(s => server.create('section', s));
+      posts.forEach(s => server.create('post', s));
+      versions.forEach(s => server.create('version', s));
+
+    },
+
+    routes () {
+      this.namespace = 'api/v1';
+
+      this.get('/sections', (schema) => {
+        return schema.sections.all();
+      })
+      this.get('/posts', (schema) => {
+        return schema.posts.all();
+      })
+      this.get('/versions', (schema) => {
+        return schema.versions.all();
+      })
+    }
+  });
+
+  return server;
+}