JSFiddle - React, Tailwind, and code Playground

by yaero

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/fast-json-patch/2.0.6/fast-json-patch.min.js"></script>

CSS

#console {
    border-bottom: 1px solid #ccc;
    background-color: #eee;
    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 += ['>', JSON.stringify(message, null, '  '), '\n'].join(' ');
    }
};

// angular.js directive vs component
/* angular.js directive */
bindings: {
	xyz: '<', // one way binding
	foo: '&',
	abc: '@',
}

/* one time binding */
<div>{{:: $ctrl.xyz }}</div>

/* angular.js constant vs value */