JSFiddle - React, Tailwind, and code Playground

HTML

<canvas id="myCanvas" width="300" height="150" style="border:1px solid #d3d3d3;"></canvas>
<br />
<input type="text" onkeyup="change(this.value)" />

JavaScript

var c = document.getElementById("myCanvas");
var ctx = c.getContext("2d");

window.change = function(val){
ctx.restore();
ctx.font = "20px Georgia";
ctx.fillText(val, 10, 50);
ctx.save();
}