JSFiddle - React, Tailwind, and code Playground

by nathggns

HTML

<canvas width='200' height='200' id='canvas'>Your browser does not support canvas - go get Chrome!</canvas>

JavaScript

var canvas = document.getElementById('canvas');

if (canvas.getContext) {
    var context = canvas.getContext('2d');
    
    var square = {
        'x': 50,
        'y': 50,
        'width': 100,
        'height': 100,
        'fill': '#000000'
    };
    
    var render = function() {
        context.clearRect(0, 0, canvas.width, canvas.height);
        context.beginPath();
        context.rect(square.x, square.y, square.width, square.height);
        context.fillStyle = square.fill;
        context.fill();
    };
    
    render();
};