JSFiddle - React, Tailwind, and code Playground

HTML

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

JavaScript

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

(function() {
  var requestAnimationFrame = window.requestAnimationFrame || window.mozRequestAnimationFrame ||
                              window.webkitRequestAnimationFrame || window.msRequestAnimationFrame;
  window.requestAnimationFrame = requestAnimationFrame;
})();

var cnt = 0;
  context.strokeStyle = 'black';
  context.lineWidth = 150;
  context.lineCap = 'square';

function draw(timestamp) {

  context.clearRect(0, 0, 600, 600);   

  context.beginPath();
  context.arc(300, 300, 150, 0, cnt / 180 * Math.PI);
  cnt++;
  if(cnt>1000)
      cnt = 0;
  context.stroke();  
  
    
  requestAnimationFrame(draw);
}
requestAnimationFrame(draw);