JSFiddle - React, Tailwind, and code Playground

HTML

<head>
<script src="//tinymce.cachefly.net/4.0/tinymce.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/ace/1.2.2/ace.js"></script>
</head>
<body>
<textarea class="test" name="test"></textarea>
<textarea name="test" cols="100" rows="5"></textarea>
<div id="edit">Stuff goes here</div>
</body>

CSS

#edit { 
        position: realtive;
        width: 100%;
        height: 200px;
    }

JavaScript

var editor = ace.edit("edit");
    var textarea = $('textarea[name="test"]');
    editor.getSession().setValue(textarea.val());
    editor.getSession().on('change', function(){
        textarea.val(editor.getSession().getValue());
    });
    editor.setTheme("https://cdnjs.cloudflare.com/ajax/libs/ace/1.2.2/theme-terminal.js");
    editor.getSession().setMode("https://cdnjs.cloudflare.com/ajax/libs/ace/1.2.2/mode-html.js");
    tinymce.init({
        selector: ".test",
        relative_urls: false,
        apply_source_formatting : true
    });