Solucionado (ver solução)

Importante

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!

Solucionado
(ver solução)
1
resposta

Melhorar código

Eu estava treinando e fiz o Steve, mas para organizar o código seria melhor deixar cada parte em uma função?

<script>
        var tela = document.querySelector('canvas'), pincel = tela.getContext('2d');

        pincel.fillStyle = '#c18663';
        pincel.fillRect(0, 0, 350, 350);

        pincel.fillStyle = '#231C09';
        pincel.fillRect(0, 0, 350, 100);

        pincel.fillStyle = '#231C09';
        pincel.fillRect(0, 100, 70, 50);

        pincel.fillStyle = '#231C09';
        pincel.fillRect(280, 100, 70, 50);

        pincel.fillStyle = '#FFFFFF';
        pincel.fillRect(60, 180, 40, 35);

        pincel.fillStyle = '#554091';
        pincel.fillRect(100, 180, 40, 35);

        pincel.fillStyle = '#FFFFFF';
        pincel.fillRect(250, 180, 40, 35);

        pincel.fillStyle = '#554091';
        pincel.fillRect(210, 180, 40, 35);

        pincel.fillStyle = '#6F3B2D';
        pincel.fillRect(140, 215, 70, 35);

        pincel.fillStyle = '#4A210F';
        pincel.fillRect(100, 250, 150, 35);

        pincel.fillStyle = '#4A210F';
        pincel.fillRect(100, 285, 40, 35);

        pincel.fillStyle = '#4A210F';
        pincel.fillRect(210, 285, 40, 35);
   </script>
1 resposta
solução!

Adler, boa tarde!

Não seria necessário criar uma função para cada, mas seria interessante criar uma função para essas duas linhas que se repetem toda vez. Assim você chama a função e a única coisa que mudaria seriam as cores as coordenadas de criação

Espero ter ajudado e bons estudos!