JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/fabric.js/1.5.0/fabric.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>
<canvas id="canvas" width="300" height="300"></canvas> <br/>

CSS

#canvas {
  border: 1px solid;
}

JavaScript

// Draw Rect
var fCanvas = activeObject = '';

$(document).ready(function() {
  var oldCanvas = document.getElementById('canvas');
  fCanvas = new fabric.Canvas('canvas',  {
    width: oldCanvas.parentNode.clientWidth, 
    height: oldCanvas.parentNode.clientHeight 
  });
  	CreateGraphicObject();
});
function CreateGraphicObject(){
    var rect = new fabric.Rect({
        left: 100,
        top: 100,
        fill: 'red',
        width: 20,
        height: 20
    });
    fCanvas.add(rect).renderAll().setActiveObject(rect);
}