JSFiddle - React, Tailwind, and code Playground

by ethanpil

HTML

<h1>
    Hello, World!
</h1>
<p>
    Here is my website
</p>

CSS

#console {
    border-bottom: 1px solid #ccc;
    background-color: #eee;
    height: 5em;
    overflow: auto;
}

JavaScript

console = {
    _createConsole : function() {
        var pre = document.createElement('pre');
        pre.setAttribute('id', 'console');
        document.body.insertBefore(pre, document.body.firstChild);
        return pre;
    },
    log: function (message) {
        var pre = document.getElementById("console") || console._createConsole();
        pre.textContent += ['>', message, '\n'].join(' ');
    }
};
console.log("This is an unobtrusive version!");
console.log("Hello World!");
console.log("Test");
console.log("Test");
console.log("Test");
console.log("Test");
console.log("Test");
console.log("Make it scrollable!");