JSFiddle - React, Tailwind, and code Playground

HTML

<canvas id="canvas" width="500" height="500"></canvas>

JavaScript

var canvas = document.getElementById('canvas');
var context = canvas.getContext('2d');

var image = new Image();
image.src = 'http://flashpunk.net/img/tut/swordguy.png';

var Animation = {};

Animation.add = function(name, frames) {
    Animation[name] = frames;
};

Animation.play = function(name) {
    
};

Animation.add('stand', [0, 1, 2, 3, 4, 5]);

var drawTile = function(x, y, tile, width, height) {
    context.drawImage(image, (tile % 6) * width, Math.floor(tile / 6) * height, width, height, x, y, width, height);
};

var draw = function() {
    drawTile(0, 0, 0, 48, 32);
};

var interval = setInterval(draw, 200);