index.html

<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/codemirror/3.19.0/codemirror.css">
<link rel="stylesheet" href="css/style.css">


<div id="wrap">

  <!-- Code Editors -->
  <section id="code_editors">
    <div id="html" class="code_box">
      <h3>HTML</h3>
      <textarea name="html"></textarea>
    </div>
    <div id="css" class="code_box">
      <h3>CSS</h3>
      <textarea name="css"></textarea>
    </div>
    <div id="js" class="code_box">
      <h3>JavaScript</h3>
      <textarea name="js"></textarea>
    </div>
  </section>
  
  <!-- Sandboxing -->
  <section id="output">
    <iframe></iframe>
  </section>
  
</div>

<script src="//cdnjs.cloudflare.com/ajax/libs/codemirror/3.19.0/codemirror.js"></script>

<!-- For HTML/XML -->
<script src="//cdnjs.cloudflare.com/ajax/libs/codemirror/3.19.0/mode/xml/xml.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/codemirror/3.19.0/mode/htmlmixed/htmlmixed.js"></script>

<!-- For CSS -->
<script src="//cdnjs.cloudflare.com/ajax/libs/codemirror/3.16.0/mode/css/css.js"></script>

<!-- For JS -->
<script src="//cdnjs.cloudflare.com/ajax/libs/codemirror/3.19.0/mode/javascript/javascript.js"></script>
<script src="js/js.js"></script>