npx create-react-app front-web --template typescript

https://www.figma.com/file/vnK7024sr7YkEe3QdvAFT6/BDS3-dashboard?node-id=0%3A1

1. instalar as dependências necessárias:

yarn add eslint prettier eslint-plugin-react-hooks @typescript-eslint/parser @typescript-eslint/eslint-plugin eslint-plugin-react eslint-config-prettier eslint-plugin-prettier --dev

2. Certifique-se de instalar as extensões do Eslint e Prettier no VSCode

3. Copiar o arquivo .eslintrc.js e adicionar na raiz da pasta front-web

4. Copiar o arquivo .prettierrc.js e adicionar na raiz da pasta front-web

5. Editar preferências do VSCode:

"editor.codeActionsOnSave": {
    "source.fixAll.eslint": true
},
"editor.formatOnSave": true, 
"eslint.alwaysShowStatus": true,

• https://flatpickr.js.org/
• https://github.com/haoxins/react-flatpickr

• https://apexcharts.com/

Esta aula te ajudará entender as funções de ordem superior: map, filter, reduce, sort

• Como formatar números/preços usando apenas JavaScript

https://developer.mozilla.org/pt-BR/docs/Web/JavaScript/Reference/Global_Objects/Intl/NumberFormat

• https://pt-br.reactjs.org/docs/hooks-reference.html#usememo

• https://medium.com/@devjpnobrega/primeiros-passos-com-react-hooks-usememo-e-usecallback-13d54da4f9ba

• http://sergiolopes.org/css-box-sizing-border-box/