Link para testar o código: https://marcoswitcel.github.io/vector-graphics-and-asteroids/public/
Para fins de referência e documentação.
- NodeJS (v16.14.2): https://nodejs.org/en/
- Typescript (Version 4.7.4): https://www.npmjs.com/package/typescript
Para testar a aplicação dois comandos são fundamentais: npm run build
, que faz o build de produção e npm run dev
que deixa o compilador do TypeScript observando edições no source code.
# Gera o build de produção
npm run build
# Deixa o compilador do TypeScript observando edições no source code
npm run dev
Durante o desenvolvimento utilizei a IDE Visual Studio Code com a extensão Live Server. O Live Server atuou com servidor HTTP e mecanismo de recarregamento automático para não precisar fazer refresh manual, ele complementou o comando npm run dev
que observa modificações nos arquivos e rebuilda quando necessário.
- https://www.digitalocean.com/community/tutorials/typescript-new-project
- https://www.w3schools.com/html/html5_canvas.asp
- https://stackoverflow.com/questions/2259476/rotating-a-point-about-another-point-2d
- https://stackoverflow.com/questions/5067368/html5-canvas-create-outer-glow-effect-of-shape
- https://www.ashleysheridan.co.uk/blog/Animated+Glowing+Lines+in+Canvas
- https://www.w3schools.com/html/html5_canvas.asp
- https://brasilescola.uol.com.br/matematica/distancia-entre-dois-pontos.htm
- https://www.w3schools.com/jsref/obj_mouseevent.asp
- https://stackoverflow.com/questions/55677/how-do-i-get-the-coordinates-of-a-mouse-click-on-a-canvas-element/18053642#18053642