Ace Editor

Minimum setup

by AntonLapshin

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/ace/1.4.5/ace.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/ace/1.4.5/ext-language_tools.js"></script>
<div id="editor">function foo(items) {
    var x = "All this is syntax highlighted";
    return x;
}</div>

CSS

#editor {
      position: absolute;
      top: 0;
      right: 0;
      bottom: 0;
      left: 0;
    }

JavaScript

var editor = ace.edit("editor");
editor.setTheme("ace/theme/monokai");
editor.session.setMode("ace/mode/javascript");
editor.setOptions({
  enableBasicAutocompletion: true,
  enableSnippets: true,
  enableLiveAutocompletion: true
});