diff --git a/frontend/src/pages/public/Blogs.vue b/frontend/src/pages/public/Blogs.vue
index b198ced..2bc6986 100644
--- a/frontend/src/pages/public/Blogs.vue
+++ b/frontend/src/pages/public/Blogs.vue
@@ -2,10 +2,24 @@
   <div class="">Blogs</div>
 </template>
 <script>
+import { ContentApi } from '../../utils/index'
 export default {
   name: 'Blogs',
   components: {},
   computed: {},
-  methods: {}
+  mounted() {
+    this.retrieve_blogs()
+  },
+  methods: {
+    retrieve_blogs() {
+      ContentApi.retrieve_blogs()
+        .then((response) => {
+          response
+        })
+        .catch((error) => {
+          this.mnx_backendErrorHandler(error)
+        })
+    }
+  }
 }
 </script>
diff --git a/frontend/src/utils/backend/content.js b/frontend/src/utils/backend/content.js
new file mode 100644
index 0000000..5aa2db5
--- /dev/null
+++ b/frontend/src/utils/backend/content.js
@@ -0,0 +1,15 @@
+import { backendAxios } from './axios'
+class ContentApi {
+  static retrieve_blogs() {
+    const request = backendAxios.post(
+      '/api/content/retrieve-blogs',
+      {
+      },
+      {
+
+      }
+    )
+    return request
+  }
+}
+export { ContentApi }
diff --git a/frontend/src/utils/backend/index.js b/frontend/src/utils/backend/index.js
index 3f8b5a3..14e8f41 100644
--- a/frontend/src/utils/backend/index.js
+++ b/frontend/src/utils/backend/index.js
@@ -6,3 +6,4 @@ export { ProviderHubApi } from './providerHub'
 export { MessageHubApi } from './messageHub'
 export { DocumentApi } from './document'
 export { HistoryApi } from './history'
+export { ContentApi } from './content'
diff --git a/frontend/src/utils/index.js b/frontend/src/utils/index.js
index 32b6f1b..bcabe6f 100644
--- a/frontend/src/utils/index.js
+++ b/frontend/src/utils/index.js
@@ -6,7 +6,8 @@ export {
   ProviderHubApi,
   MessageHubApi,
   DocumentApi,
-  HistoryApi
+  HistoryApi,
+  ContentApi
 } from './backend/index'
 
 export { userUtils, userProfileUtils, requestIssueUtils, requestHubUtils } from './store/index'