esta sem o texto mas com menos repeticoes | JavaScript e HTML: pratique lógica com desenhos, animações e um jogo

<canvas width = "600" height = "400"></canvas>
<script>
      function desenhaQuadrado(x, y, tamanho, cor){

      var tela = document.querySelector("canvas");
      var pincel = tela.getContext("2d");


      pincel.fillStyle = cor;
      pincel.fillRect(x, y, tamanho, tamanho); // desenha i retangulo de lados iguais que é um quadrado.
      pincel.fillStroke = "black";
      pincel.strokeRect(x, y, tamanho, tamanho);
      }
      var x = 0;
      var tamanho = 50;
      while(x < 150){
        desenhaQuadrado(x,0,tamanho,"green"); // faz os tres quadrados verdes.
        x = x + 50;
      }
      desenhaQuadrado(x,0,tamanho,"white");// faz o quadrado branco.
</script>