Trivia

✏ Sobre o projeto

O objetivo do projeto é desenvolver uma aplicação de um jogo de trivia (jogo de perguntas e respostas), consumindo a API The Trivia Api para a geração das perguntas. O projeto consiste em uma tela de login, tela do jogo, página de feedback e ranking. Se o usuário logar no jogo com o email que tiver cadastro no site Gravatar, terá sua foto associada ao perfil da pessoa usuária no jogo, logo na seqüência o usuário tem acesso ao jogo em si. ⏳

O jogo tem 5 perguntas, com 30 segundos para responder cada uma. Caso seja escolhida a resposta correta, a pontuação será baseada no tempo em que levou para responder e na dificuldade da pergunta, após o jogador terminar a partida irá para a tela de feedback que consiste em uma simples avaliação com base na quantidade de perguntas que o jogador acertou, e poderá escolher voltar para tela inicial ou conferir sua pontuação no ranking comparado com outros jogadores da maquina. 🏆

Foram desenvolvidos testes para cada tela da aplicação utilizando o Jest e a biblioteca React Test Library (RTL). 👨‍💻

Habilidades desenvolvidas:

• Uso do ReactJS com componentes de classe para desenvolvimento do projeto.

• Uso do React Router para paginação.

• Uso do Redux no gerenciamento do estado global;

• Uso do store Redux em aplicações React

• Uso de reducers no Redux em aplicações React

• Uso de actions no Redux em aplicações React

• Uso de dispatchers no Redux em aplicações React

• Conectar Redux aos componentes React

• Uso de actions assíncronas na aplicação React que faz uso de Redux.

• Uso do React Testing Library para escrever testes e garantir que a aplicação possua uma boa cobertura de testes

🔧 Principais tecnologias utilizadas:

• JavaScript;
• React.js;
• Redux.js
• React Router Dom
• Fetch API
• Jest
• RTL - React Test Library
• Tailwind

Como utilizar o projeto na sua máquina

1. Deploy:
https://newtrivianeon.netlify.app/

2. Faça o git clone na sua máquina e entre no diretório:

• Lembre-se de clonar o repositório no diretório desejado na sua máquina!

git@github.com:Marcio-Gabriel-Roque-Mendes/trivia-project.git
cd trivia-project

Instale as dependências

• Atente-se para instalar na pasta raiz do projeto

 npm install

Inicie a aplicação

 npm start

Rode todos os testes com o seguinte comando:

npm run test 

Para rodar um teste em específico, digite o seguinte comando, seguido do nome de arquivo de teste que deseja executar. Exemplo:

npm run test CardGame.test.js

• Dica: Todos os arquivos de testes desenvolvidos para esse projeto podem ser encontrado no seguinte diretorio:

src/tests

Este projeto foi desenvolvido em grupo por:

• Bruno Emanuel
• Cesar Holanda
• Marcelo Lima
• Marcio Gabriel

Utilizamos a metodologia agil Kanban para a gestão de fluxo do nosso trabalho pelo Trello, em paralelo com outras ferramentas de comunicação assíncrona neste caso o Slack e comunicação síncrona sendo o Zoom para videochamada.

Mais informações dos colaboradores do projeto podem ser encontradas nessa publicação feita no Linkedin.

Prévia da aplicação rodando:

demonstracao.da.aplicacao.rodando.mp4

Código desenvolvido pelo grupo no projeto Trivia no curso de Desenvolvimento Full Stack da Trybe no qual os alunos deveriam desenvolve-lo para fins didáticos