diff --git a/src/components/CodeEditor/index.jsx b/src/components/CodeEditor/index.jsx
index 663ac940..e7fc91c1 100644
--- a/src/components/CodeEditor/index.jsx
+++ b/src/components/CodeEditor/index.jsx
@@ -9,7 +9,6 @@ import * as fabric from 'fabric';
 import { debounce } from 'lodash';
 import React, { useCallback, useEffect, useRef, useState } from 'react';
 import { Helmet } from 'react-helmet';
-import { functionToCodeString } from './utils';
 
 export const CodeEditor = ({ code: codeProp, children, canvasId }) => {
   const divRef = useRef();
@@ -54,7 +53,7 @@ export const CodeEditor = ({ code: codeProp, children, canvasId }) => {
         return null;
       },
     });
-    const parsedCode = functionToCodeString(codeProp);
+    const parsedCode = codeProp;
 
     const startState = EditorState.create({
       doc: parsedCode,
diff --git a/src/content/demo/animating-crosses/code.js b/src/content/demo/animating-crosses/code.js
index 470135d7..276e9c7a 100644
--- a/src/content/demo/animating-crosses/code.js
+++ b/src/content/demo/animating-crosses/code.js
@@ -1,4 +1,4 @@
-export function code(canvasEl, fabric) {
+export const code = `
   const canvas = new fabric.Canvas(canvasEl);
 
   class Cross extends fabric.Object {
@@ -71,4 +71,4 @@ export function code(canvasEl, fabric) {
     canvas.requestRenderAll();
     requestAnimationFrame(animate);
   });
-}
+`;
diff --git a/src/content/demo/animation-easing/code.js b/src/content/demo/animation-easing/code.js
index 828f06d5..acfd1189 100644
--- a/src/content/demo/animation-easing/code.js
+++ b/src/content/demo/animation-easing/code.js
@@ -1,4 +1,4 @@
-export function code(canvasEl, fabric) {
+export const code = `
   const canvas = new fabric.Canvas(canvasEl);
 
   const rect = new fabric.Rect({
@@ -28,4 +28,4 @@ export function code(canvasEl, fabric) {
       }
     );
   };
-}
+`;
diff --git a/src/content/demo/clipping/code.js b/src/content/demo/clipping/code.js
index b2ad5641..c82a80ae 100644
--- a/src/content/demo/clipping/code.js
+++ b/src/content/demo/clipping/code.js
@@ -1,4 +1,4 @@
-export function code(canvasEl, fabric) {
+export const code = `
   const canvas = new fabric.Canvas(canvasEl);
   const demoImg = 'http://fabricjs.com/assets/pug.jpg';
 
@@ -40,4 +40,4 @@ export function code(canvasEl, fabric) {
     canvas.add(img);
     canvas.setActiveObject(img);
   });
-}
+`;
diff --git a/src/content/demo/loading-custom-fonts/code.js b/src/content/demo/loading-custom-fonts/code.js
index 6c70e467..27975c6b 100644
--- a/src/content/demo/loading-custom-fonts/code.js
+++ b/src/content/demo/loading-custom-fonts/code.js
@@ -1,4 +1,4 @@
-export function code(canvasEl, fabric) {
+export const code = `
   const urlMap = {
     VT323:
       'url(https://fonts.gstatic.com/s/vt323/v17/pxiKyp0ihIEF2isfFJXUdVNF.woff2)',
@@ -74,6 +74,4 @@ export function code(canvasEl, fabric) {
     });
     canvas.add(pacifico, vt323, lato100, lato900);
   });
-}
-
-export const codeString = '';
+`;
diff --git a/src/content/demo/simple-test/code.js b/src/content/demo/simple-test/code.js
index 92dbe348..e18fb428 100644
--- a/src/content/demo/simple-test/code.js
+++ b/src/content/demo/simple-test/code.js
@@ -1,5 +1,5 @@
-export function code(canvasEl, fabric) {
+export const code = `
   const canvas = new fabric.Canvas(canvasEl);
   const rect = new fabric.Rect({ width: 100, height: 100 });
   canvas.add(rect);
-}
+`;