<canvas width="600" height="400"></canvas>
<script>
var tela = document.querySelector ('canvas');
var pincel = tela.getContext('2d');
pincel.fillRect (0, 0, 600, 400);
</script>
Você está vendo a versão anterior da nova experiência da Alura que estamos preparando para você. Em breve, ela ganha uma identidade visual novinha totalmente pensada em potencializar seus estudos!
<canvas width="600" height="400"></canvas>
<script>
var tela = document.querySelector ('canvas');
var pincel = tela.getContext('2d');
pincel.fillRect (0, 0, 600, 400);
</script>
O tamanho da tela canvas é 600 por 400. Com a instrução pincel.fillRect (0, 0, 600, 400);, você desenhou um retangulo do tamanho da tela(canvas). Ela aparece em preto. Mude a cor com a instrução pincel.fillStyle='blue'; Teste, também, mudando o tamanho do retangulo para 300, 200 por exemplo.
<canvas width="600" height="400"></canvas>
<script>
var tela = document.querySelector ('canvas');
var pincel = tela.getContext('2d');
pincel.fillStyle='blue';
pincel.fillRect (0, 0, 600, 400);
</script>