JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://codemirror.net/lib/codemirror.js"></script>
<script src="http://codemirror.net/mode/xml/xml.js"></script>
<script src="http://codemirror.net/mode/javascript/javascript.js"></script>
<script src="http://codemirror.net/mode/css/css.js"></script>
<script src="http://codemirror.net/mode/htmlmixed/htmlmixed.js"></script>
<link rel="stylesheet" href="http://codemirror.net/lib/codemirror.css">
<link rel="stylesheet" href="http://codemirror.net/doc/docs.css">
<textarea id=code name=code>
&lt;!doctype html&gt;
&lt;html&gt;
  &lt;head&gt;
    &lt;meta charset=utf-8&gt;
    &lt;title&gt;HTML5 canvas demo&lt;/title&gt;
    &lt;style&gt;p {font-family: monospace;}&lt;/style&gt;
  &lt;/head&gt;
  &lt;body&gt;
    &lt;p&gt;Canvas pane goes here:&lt;/p&gt;
    &lt;canvas id=pane width=300 height=200&gt;&lt;/canvas&gt;
    &lt;script&gt;
      var canvas = document.getElementById('pane');
      var context = canvas.getContext('2d');

      context.fillStyle = 'rgb(250,0,0)';
      context.fillRect(10, 10, 55, 50);

      context.fillStyle = 'rgba(0, 0, 250, 0.5)';
      context.fillRect(30, 30, 55, 50);
    &lt;/script&gt;
  &lt;/body&gt;
&lt;/html&gt;</textarea>
    <iframe id=preview></iframe>

CSS

.CodeMirror {
	float: left;
	width: 50%;
	border: 1px solid black;}

iframe {
	width: 49%;
	float: left;
	height: 300px;
	border: 1px solid black;
	border-left: 0px;}

JavaScript

var delay;
      // Initialize CodeMirror editor with a nice html5 canvas demo.
      var editor = CodeMirror.fromTextArea(document.getElementById('code'), {
        mode: 'text/html',
        tabMode: 'indent'
      });
      editor.on("change", function() {
        clearTimeout(delay);
        delay = setTimeout(updatePreview, 300);
      });
      
      function updatePreview() {
        var previewFrame = document.getElementById('preview');
        var preview =  previewFrame.contentDocument ||  previewFrame.contentWindow.document;
        preview.open();
        preview.write(editor.getValue());
        preview.close();
      }
      setTimeout(updatePreview, 300);