COPA 2022

Conteúdo

• Sobre a aplicação
• Tecnologias
• Iniciando a Aplicação
• Screenshots
• Licença
• Contato

Sobre a aplicação

Aplicação desenvolvida durante o evento Full Stack Challenge, edição Copa 2022, promovido pela Codar.me.
Foram 5 dias de aula, totalizando mais de 11 horas de vídeo, desenvolvendo uma API em Node e um front-end em React.
A aplicação possui um cadastro de usuários, com tela de login e de cadastro. Ao logar, o sistema entra na Dashboard, que mostra os jogos da Copa realizados no dia informado.
Além disso, permite dar palpites na pontuação dos jogos.
Todos os palpites são armazenados na nuvem, em um banco de dados do PlanetScale.
Foram feitas algumas melhorias no Front-end, como por exemplo, Phosphor-Icons para exibir ícones, ao invés de arquivo Svg. Além disso, notificações de erro são exibidas utilizando React-Toastify.
Ao final da última aula, foi explicado como fazer o deploy da API na Vercel. A aplicação está disponível aqui.

🛠️ Tecnologias

• Back-end
  • Node + Koa + Cors
  • Prisma ORM para acessar o banco de dados
  • JsonWebToken para autenticação JWT
• Front-end
  • React + Vite
  • TailwindCSS para estilização.
  • Formik / Yup para validação de formulários
  • React-Use para Hooks
  • Date-Fns para lidar com datas.
  • Phosphor-React para exibir ícones
  • React-Toastify para exibição de mensagens
  • Axios para acessar a API.

🚗 Iniciando a aplicação

Baixe o repositório com git clone e entre na pasta do projeto.
Renomeie os arquivos .env.example para .env e informe as URLs e o JWT secret.

$ git clone https://github.com/luiizsilverio/codarme-copa

• Back-end

$ cd api
$ npm install
$ npm run dev

• Front-end

$ cd ..
$ cd web
$ npm install
$ npm run dev

📸 Screenshots

⚖️ Licença

Este projeto está licenciado sob a licença MIT.

📧 Contato

E-mail: luiiz.silverio@gmail.com