diff --git a/package.json b/package.json
index 096f95d6..7518cb48 100644
--- a/package.json
+++ b/package.json
@@ -37,6 +37,7 @@
     "react-hotkeys-hook": "^4.4.0",
     "react-konva": "^18.2.8",
     "react-konva-utils": "^1.0.5",
+    "react-textarea-autosize": "^8.5.3",
     "reflect-metadata": "^0.1.13",
     "remark-gfm": "^3.0.1",
     "sass": "^1.63.3",
diff --git a/src/app/Layouts.tsx b/src/app/Layouts.tsx
index 4d9f2e8e..1b5348ed 100644
--- a/src/app/Layouts.tsx
+++ b/src/app/Layouts.tsx
@@ -4,10 +4,16 @@ import { ControlAccordion } from "./common.blocks/panel/ControlAccordion";
 import { PanelContainer } from "./common.blocks/panel/Panel";
 import { GeneralConfigAccordion } from "./common.blocks/panel/GeneralConfigAccordion";
 import { PathConfigAccordion } from "./common.blocks/panel/PathAccordion";
+import { CodeAccordion } from "./common.blocks/panel/CodeAccordion";
 
 export const LayoutContext = React.createContext<LayoutType>(LayoutType.Classic);
 export const LayoutProvider = LayoutContext.Provider;
 
 export const getAllPanelContainers = (layout: LayoutType): PanelContainer[] => {
-  return [GeneralConfigAccordion({ layout }), ControlAccordion({ layout }), PathConfigAccordion({ layout })];
+  return [
+    GeneralConfigAccordion({ layout }),
+    CodeAccordion({ layout }),
+    ControlAccordion({ layout }),
+    PathConfigAccordion({ layout })
+  ];
 };
diff --git a/src/app/common.blocks/panel/CodeAccordion.tsx b/src/app/common.blocks/panel/CodeAccordion.tsx
new file mode 100644
index 00000000..89439484
--- /dev/null
+++ b/src/app/common.blocks/panel/CodeAccordion.tsx
@@ -0,0 +1,35 @@
+import { TextareaAutosize, Typography } from "@mui/material";
+import { getAppStores } from "@core/MainApp";
+import { LayoutType } from "@core/Layout";
+import { PanelContainer } from "./Panel";
+import LinearScaleIcon from "@mui/icons-material/LinearScale";
+import "./PathAccordion.scss";
+
+export const CodeAccordion = (props: { layout: LayoutType }): PanelContainer => {
+  const { app } = getAppStores();
+  let decoder = new TextDecoder("utf-8");
+  const pc = app.selectedPath?.pc;
+  const newValue = app.exportFile();
+  console.log(newValue);
+  let arrayBuffer = newValue;
+  let string = decoder.decode(arrayBuffer);
+  let index = string.indexOf(`#PATH.JERRYIO-DATA`);
+  if (index !== -1) {
+    string = string.substring(0, index);
+  }
+
+  return {
+    id: "CodeAccordion",
+    header: "Code Output",
+    children: (
+      <>
+        <TextareaAutosize
+          value={string}
+          readOnly
+          style={{ width: "100%", backgroundColor: "transparent", color: "white" }}
+        />
+      </>
+    ),
+    icon: <LinearScaleIcon fontSize="large" />
+  };
+};