meu círculo na animação da tela não quer seguir em frente

estou tentando minha primeira prática em canvas js / html, mas não funciona comigo, aqui está meu código:
html:
<html lang = “us”>

<head>
<style type = “text / css”>
canvas {
border: black solid 2px;
}
corpo {
margem: 0px;
}
</style>

</head>
<body>
<canvas> </canvas>
<script src = “animateC.js”> </script>

</body>

</html>

// aqui está meu código JS
var canvas = document.querySelector (‘canvas’);
canvas.width = window.innerWidth;
canvas.height = window.innerHeight;
var c = canvas.getContext (‘2d’);

var x = 200;
função animate ()
{requestAnimationFrame (animate);
c.beginPath ();
c.arc (x, 200,30,0, Math.PI * 2, falso);
c.strokeStyle = “vermelho”;
c.stroke ();
x + = 1;

}