JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://fabricjs.com/lib/fabric.js"></script>
<script src="http://fabricjs.com/lib/font_definitions.js"></script>
<script src="http://fabricjs.com/lib/fonts/Delicious.font.js"></script>
<canvas id="c" width="1000" height="562" style="border:1px solid #ccc"></canvas>

JavaScript

var data = {objects: [{type: "text",left: 525,top: 196,width: 108,height: 62.4,fill: "#c94646",overlayFill: null,stroke: null,strokeWidth: 1,strokeDashArray: null,scaleX: 1.81,scaleY: 1.81,angle: -5.93,flipX: false,flipY: false,opacity: 1,selectable: true,hasControls: true,hasBorders: true,hasRotatingPoint: false,text: "TextJclknk\nnclkfk",fontSize: 24,fontWeight: 100,fontFamily: "Delicious",fontStyle: "",lineHeight: 1.3,textDecoration: "",textShadow: "",textAlign: "center",path: null,strokeStyle: "",backgroundColor: "transparent",useNative: true}, {type: "image",left: 866,top: 451,width: 280,height: 21   0,fill: "rgb(0,0,0)",overlayFill: null,stroke: null,strokeWidth: 1,strokeDashArray: null,scaleX: 0.85,scaleY: 0.85,angle: 7.25,flipX: true,flipY: true,opacity: 1,selectable: true,hasControls: true,hasBorders: true,hasRotatingPoint: false,src: "http://placekitten.com/280/210",filters: []}],background: "rgba(0, 0, 0, 0)",backgroundImage: "http://lorempixel.com/output/abstract-q-g-52-52-6.jpg",backgroundImageOpacity: 1,backgroundImageStretch: false};

var canvas = new fabric.Canvas('c');


canvas.loadFromJSON(JSON.stringify(data));

canvas.calcOffset();
canvas.renderAll();