Esse projeto foi desenvolvido com as seguintes tecnologias:
Você pode visualizar o layout do projeto através desse link.
- Clone o repositório
- Instale as dependências com
npm i - Inicie o servidor com
npm dev
Agora você pode acessar localhost:3000 do seu navegador.
Ou acesse o projeto hospedado no Firebase.
Inicialmente usei o create-react-app mas demorava muito para atualizar as modificações e para realizar instações então me desafiei a fazer com Vitejs.
O Vite é um bundler alternativo ao Gulp e Webpack, sendo assim ele possui um starter-template próprio para ReactJS que é muito mais rápido que o create-react-app mantido pelo Facebook.
- Ele ja vai ter um template de ReactJS + TypeScript.
- A pasta index.html fica na raiz do projeto no Vite, além do arquivo .tsx principal não ser o index mas o main (coisas que você pode mudar facilmente renomeando, eu manti como main).
- A coisa mais complicada foi aquela configuração de variáveis de ambiente, mas você pode ver minhas configrações no arquivo de firebase.ts (um agradecimento ao Lucas Teixeira e ao Sampaio Leal dentro da comunidade no Discord da Rocketseat que me ajudaram com estas configurações) e nas variáveis de ambiente propriamente dito dentro do arquivo .env.local basta trocar REACT_APP_ por VITE__.