JSFiddle - React, Tailwind, and code Playground

by Nathan Piper

HTML

<canvas id="game" height=400 width=500 style="border: 1px solid green">

JavaScript

var fps = 60;
var width = 500;
var height = 400;

var g = document.getElementById('game').getContext('2d');

var rect = {
    x: width/2-200,
    y: height/2,
    width: 60,
    heigth: 20,
    tick: function () {
        g.fillRect(this.x, this.y, this.width, this.height);
        this.width--;
}
}

function tick () {
    rect.tick();
}

setInterval(function () {
    tick()
}, 1000/fps)