O que aprendi criando um simluador simples de radar com HMTL Canvas e JS?

Vinicius Basilio - Aug 20 - - Dev Community

Introdução

Bom, esse projeto veio do famoso dito popular, “mente vazia é oficina do vamos iniciar outro projeto”. Brincadeiras a parte, queria contar uma história, primeiro, nunca estudei programação formalmente e até hoje não entendo o porquê, sempre aparece outra coisa mais “urgente”, e a segunda é: não lembro de nada das aulas de matemática.

Então, decidi mudar esse cenário e encarar um projeto que me ajudasse a programar melhor e, de quebra, me ensinasse alguns conceitos de matemática. Foi aí que lembrei de um projeto do freeCodeCamp.org sobre como criar um simulador de carro guiado por IA, feito pelo Radu (link aqui). O cara fez tudo na unha, nem TS ele usou! Lembro que quando terminei esse mini curso, olhei para o código e pensei “é, acho que não vou lembrar de nada disso no futuro.”

O Desafio

Image description

O que eu queria com todo esse preambulo era dizer: acordei com isso na cabeça e decidi criar algo similar, mas um pouco mais simples. Resolvi fazer um sensor, sem recorrer a nenhuma biblioteca ou revisitar o código original. Queria que fosse só eu e meu assistente GPT nessa jornada.

Reflexões e Aprendizados

Para quem tá preso no “tutorial hell”, aqui estão alguns pontos que achei importantes:

  • Aumentando suas referências: Esses vídeos, na minha opinião, ajudam a expandir sua forma de pensar. Você não vai sair de lá com o mesmo conhecimento que a pessoa no vídeo, mas vai sair com novas referências. É como um artista que aprende técnicas de grandes mestres antes de criar seu próprio estilo. No final, eu lembrava de muitas coisas das aulas, mesmo que foram há meses.
  • Desafios são legais: O mais bacana foi terminar o projeto e sentir que, apesar de passar 90% do tempo tentando entender e não programando de fato, quando o projeto rodou, foi uma sensação incrível. Esses projetos têm aplicações reais; os fundamentos são os mesmos usados em jogos, por exemplo.
  • Entenda os fundamentos: Se eu tivesse usado uma lib ou uma engine de jogo, acho que não entenderia tão bem o conceito por trás. Gosto de levantar o capô e ver como tudo funciona. Para projetos grandes, isso é impossível, mas para aprender conceitos, é essencial.

O Projeto: Radar Simples com HTML Canvas e JS

Agora, quero mostrar para vocês o resultado desse aprendizado: uma versão extremamente simples de radar usando HTML Canvas e JavaScript. O mais interessante foi implementar tudo isso sem usar nenhuma biblioteca.

O projeto está em: https://stackblitz.com/edit/vitejs-vite-bu1acf?file=main.js

Pretendo mexer mais nele num futuro não muito próximo!

Dicas Finais

  1. Valorize os fundamentos: Entender o básico te ajuda a enfrentar qualquer desafio.
  2. Não tenha medo de errar: A maior parte do tempo vai ser de tentativas e erros, e tá tudo bem com isso.
  3. Encare desafios de cabeça erguida: Cada projeto finalizado é uma vitória e uma oportunidade de aprendizado.

Conclusão

Se você está começando ou quer se desafiar, sugiro que tente criar um projeto do zero, sem libs. Compartilhe suas experiências e desafios, mas por favor, não crie mais um framework js!

. . . . . . .