diff --git a/src/pages/[roadmapId].json.ts b/src/pages/[roadmapId].json.ts
index 56a9cc507..9c04991b8 100644
--- a/src/pages/[roadmapId].json.ts
+++ b/src/pages/[roadmapId].json.ts
@@ -1,29 +1,87 @@
 import type { APIRoute } from 'astro';
+import path from 'node:path';
+import fs from 'node:fs';
+import matter from 'gray-matter';
+import { fileURLToPath } from 'node:url';
 
-export const prerender = true;
+export const prerender = false;
 
-export async function getStaticPaths() {
-  const roadmapJsons = import.meta.glob('/src/data/roadmaps/**/*.json', {
-    eager: true,
-  });
+// Get the project root directory
+const __filename = fileURLToPath(import.meta.url);
+const __dirname = path.dirname(__filename);
 
-  return Object.keys(roadmapJsons).map((filePath) => {
-    const roadmapId = filePath.split('/').pop()?.replace('.json', '');
-    const roadmapJson = roadmapJsons[filePath] as Record<string, any>;
+// hack to make it work. TODO: Fix
+const projectRoot = path.resolve(__dirname, '../..').replace(/dist$/, '');
 
-    return {
-      params: {
-        roadmapId,
-      },
-      props: {
-        roadmapJson: roadmapJson?.default,
-      },
-    };
-  });
+export async function fetchRoadmapJson(roadmapId: string) {
+  const response = await fetch(
+    `https://roadmap.sh/api/v1-official-roadmap/${roadmapId}`,
+  );
+
+  if (!response.ok) {
+    throw new Error(`Failed to fetch roadmap json: ${response.statusText}`);
+  }
+
+  const data = await response.json();
+  if (data.error) {
+    throw new Error(`Failed to fetch roadmap json: ${data.error}`);
+  }
+
+  return data;
 }
 
 export const GET: APIRoute = async function ({ params, request, props }) {
-  return new Response(JSON.stringify(props.roadmapJson), {
+  const { roadmapId } = params;
+
+  if (!roadmapId) {
+    return new Response('Roadmap ID is required', {
+      status: 400,
+    });
+  }
+
+  // Construct the path to the markdown file
+  let roadmapFilePath = path.join(
+    projectRoot,
+    'src',
+    'data',
+    'roadmaps',
+    roadmapId,
+    `${roadmapId}.md`,
+  );
+
+  let roadmapJsonPath = path.join(
+    projectRoot,
+    'src',
+    'data',
+    'roadmaps',
+    roadmapId,
+    `${roadmapId}.json`,
+  );
+
+  if (!fs.existsSync(roadmapFilePath)) {
+    return new Response(JSON.stringify({ error: 'Roadmap file not found' }), {
+      status: 404,
+    });
+  }
+
+  // Read and parse the markdown file
+  const fileContent = fs.readFileSync(roadmapFilePath, 'utf-8');
+  const { data: frontmatter, content } = matter(fileContent);
+
+  if (frontmatter.renderer !== 'editor') {
+    const roadmapJson = JSON.parse(fs.readFileSync(roadmapJsonPath, 'utf-8'));
+
+    return new Response(JSON.stringify(roadmapJson), {
+      status: 200,
+      headers: {
+        'Content-Type': 'application/json',
+      },
+    });
+  }
+
+  const roadmapJson = await fetchRoadmapJson(roadmapId);
+
+  return new Response(JSON.stringify(roadmapJson), {
     status: 200,
     headers: {
       'Content-Type': 'application/json',