feat: implementing basic roadmap page with functional nodes

Author: SantiSev

career_demo_content.json

@@ -22,6 +22,7 @@
     "@radix-ui/react-tooltip": "^1.2.7",
     "@react-oauth/google": "^0.12.2",
     "@tailwindcss/vite": "^4.1.11",
+    "@xyflow/react": "^12.8.2",
     "axios": "^1.10.0",
     "class-variance-authority": "^0.7.1",
     "clsx": "^2.1.1",

package.json

@@ -0,0 +1,11 @@
+import RoadmapRender from "@/app/pages/roadmap-page/components/RoadmapRender";
+import RoadmapHeader from "./components/RoadmapHeader";
+
+export default function RoadmapPage() {
+  return (
+    <div className="flex h-full w-full flex-col items-center justify-start gap-4">
+      <RoadmapHeader />
+      <RoadmapRender />
+    </div>
+  );
+}

pnpm-lock.yaml

@@ -0,0 +1,7 @@
+export default function RoadmapHeader() {
+  return (
+    <div className="flex w-full items-center justify-between border-b p-4 mt-1">
+      <h1 className="text-xl font-bold">Your Roadmap</h1>
+    </div>
+  );
+}