diff --git a/src/pages/[roadmapId].json.ts b/src/pages/[roadmapId].json.ts
index c5720a5c4..16ad93c30 100644
--- a/src/pages/[roadmapId].json.ts
+++ b/src/pages/[roadmapId].json.ts
@@ -3,6 +3,7 @@ import path from 'node:path';
 import fs from 'node:fs';
 import matter from 'gray-matter';
 import { fileURLToPath } from 'node:url';
+import type { OfficialRoadmapDocument } from '../queries/official-roadmap';
 
 export const prerender = false;
 
@@ -30,10 +31,16 @@ type RoadmapJson = {
 
 export async function fetchRoadmapJson(
   roadmapId: string,
-): Promise<RoadmapJson> {
-  const response = await fetch(
-    `https://roadmap.sh/api/v1-official-roadmap/${roadmapId}`,
+): Promise<OfficialRoadmapDocument> {
+  const isDev = import.meta.env.DEV;
+  const baseUrl = new URL(
+    isDev ? 'http://localhost:8080' : 'https://roadmap.sh',
   );
+  baseUrl.pathname = isDev
+    ? `/v1-official-roadmap/${roadmapId}`
+    : `/api/v1-official-roadmap/${roadmapId}`;
+
+  const response = await fetch(String(baseUrl));
 
   if (!response.ok) {
     throw new Error(`Failed to fetch roadmap json: ${response.statusText}`);
@@ -56,48 +63,7 @@ export const GET: APIRoute = async function ({ params, request, props }) {
     });
   }
 
-  // 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({ message: 'Roadmap 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: {
diff --git a/src/queries/official-roadmap.ts b/src/queries/official-roadmap.ts
index 349abb946..9541d75dc 100644
--- a/src/queries/official-roadmap.ts
+++ b/src/queries/official-roadmap.ts
@@ -2,14 +2,60 @@ import { queryOptions } from '@tanstack/react-query';
 import { httpGet } from '../lib/query-http';
 import type { Node, Edge } from '@roadmapsh/editor';
 
+export const allowedOfficialRoadmapType = ['skill', 'role'] as const;
+export type AllowedOfficialRoadmapType =
+  (typeof allowedOfficialRoadmapType)[number];
+
+export const allowedOfficialRoadmapQuestionType = ['faq', 'main'] as const;
+export type AllowedOfficialRoadmapQuestionType =
+  (typeof allowedOfficialRoadmapQuestionType)[number];
+
+export type OfficialRoadmapQuestion = {
+  _id: string;
+  type: AllowedOfficialRoadmapQuestionType;
+  title: string;
+  // Tiptap JSON Content
+  description: any;
+};
+
 export interface OfficialRoadmapDocument {
   _id: string;
-  title: string;
-  description?: string;
+  order: number;
+
+  title: {
+    card: string;
+    page: string;
+  };
+  description: string;
+
   slug: string;
   nodes: Node[];
   edges: Edge[];
 
+  draft: {
+    nodes: Node[];
+    edges: Edge[];
+  };
+
+  seo: {
+    title: string;
+    description: string;
+    keywords: string[];
+  };
+  partner?: {
+    description: string;
+    linkText: string;
+    link: string;
+  };
+  type: AllowedOfficialRoadmapType;
+  dimensions?: {
+    height: number;
+    width: number;
+  };
+
+  questions?: OfficialRoadmapQuestion[];
+  relatedRoadmaps?: string[];
+
   createdAt: Date;
   updatedAt: Date;
 }