diff --git a/apps/canvas/src/Config.tsx b/apps/canvas/src/Config.tsx
new file mode 100644
index 0000000..23a3254
--- /dev/null
+++ b/apps/canvas/src/Config.tsx
@@ -0,0 +1,23 @@
+import { useNodes } from "@xyflow/react";
+import { AppNode, useEnv } from "./lib/state";
+import { generateDodoConfig } from "./lib/config";
+import { useEffect, useMemo, useState } from "react";
+
+export function Config() {
+    const env = useEnv();
+    const [nodes, setNodes] = useState<AppNode[]>([]);
+    const n = useNodes<AppNode>();
+    useEffect(() => {
+        console.log(n);
+        if (n && n.length > 0) {
+            setNodes(n);
+        }
+    }, [n, setNodes]);
+    const config = useMemo(() => generateDodoConfig(nodes, env), [nodes, env]);
+    const configS = useMemo(() => JSON.stringify(config, undefined, 4), [config]);
+    return (
+        <div className="px-5">
+            <pre>{configS}</pre>
+        </div>
+    )
+}
\ No newline at end of file