JSFiddle - React, Tailwind, and code Playground

HTML

<canvas id="myCanvas" width="808" height="600"></canvas>

CSS

body {
        margin: 0px;
        padding: 0px;
        background: #ccc
      }

JavaScript

var canvas = document.getElementById('myCanvas');
      var context = canvas.getContext('2d');
      var first_img = new Image(),
      second_img = new Image();

      

      first_img.src = 'http://www.html5canvastutorials.com/demos/assets/darth-vader.jpg';
     second_img.src = 'http://tux.crystalxp.net/png/mimipunk-tux-cartoon-1820.png';

      //first_img.src = 'assets/images/darth-vader.jpg';
      //second_img.src = 'assets/images/cut-img.png';

      var draw = function(){


	      second_img.onload = function() {
	        context.drawImage(second_img, 50, 50);
	      };
	      
	      first_img.onload = function() {
	        context.drawImage(first_img, 50, 50);
	      };
	      	

      };

      draw();