Olá você que me lê.
Esse vai ser o primeiro post de uma série sobre canvas do zero, basedo em livros, videos, posts e testes.
A cada conceito interessante ou importante, será escrito um post.
Como primeiro post vamos falar um pouco do que é o canvas e conceitos importantes para domina-lo.
O que é HTML5 Canvas?
Canvas é uma tag do HTML5 usada para definir um quadro de desenho gráfico 2D ou 3D, para fazer eses desenhos é necessario o uso do JavaScript, ou seja a tag canvas no HTML5 só reserva o espaço assim como outras tags.
É possivel ultilizar atributos globais nesta tag, como ID, Class, Style e por ai vai.
A tag canvas é escrita:
Contendo uma abertura e um fechamento.
Qual a vantagem de usar canvas sendo que posso desenhar com svg ou css?
Sendo o canvas um elemento dedicado para renderização de vários frames por segundo(fps), este tem a vantagem de ser mais performático do que outras formas de animação e interação gráficas dentro de projetos, não perdemos qualidade e nos dá a posibilidade criar animações, jogos e interações mais complexas.
Conceitos básicos
Cada conceito será melhor explicado com um post dedicado, abaixo está uma visão geral sobre o que precisamos aprender para dominar o canvas.
1- Criar e Mudar o tamanho do canvas
2- Desenhar elementos no canvas
3- Animar elementos no canvas
4- Interagir com os elementos do canvas
A partir do ponto que conseguirmos fazer esses quatro passos sem dificuldade é possivel criar jogos , animações e elementos interativos em nossos projetos web.
meu objetivo é começar por esse ponto e explorar todas as possibilidades que o JavaScript pode nos oferecer, essa linguagem tão estranha e tão maravilhosa ao mesmo tempo.
Obrigado por ler, duvidas sugestões ou criticas, aqui em baixo nos comentários ou por email. Terei o prazer em responder.
Referências:
Video -> Chris course
Top comments (0)