O projeto consiste na criação de uma Pokedex online. A ideia é que usemos a Poke Api como fonte de dados. Ela é uma API pública, bastante utilizada para aplicações focadas em aprendizado de programação.
- Home
- Na pagina home é possivel ver a lista de Pokémons vindos da API
- Os Pokémons podem ser adicionados à Pokédex
- Ao clicar na imagem do Pokémon você será direcionado à página de detalhes
- Ao adicionar o Pokémon, o botão Pokebola Aberta muda para Pokebola Fechada, fazendo com que não seja possivel adicionar mesmo Pokémon duas vezes na Pokedex
- Acesso à Pokedex
- Paginação
- Pokédex
- Ver os Pokémons adicionados
- Remover os pokémons da pokedex
- Acesso à página de detalhes clicando na imagem do Pokémon
- Voltar para a home clicando no Logo ou na imagem de Pokedex aberta
- Detalhes do Pokemon
- Na página de detalhes é possivel ver informações do Pokémon. Como:
- Fotos
- Tipo
- Estatisticas
- Movimentos
- Batalha Pokemon
- Na página de batalhas é possivel jogar no estilo Super Trunfo
- Os Pokémons são sorteados e é possivel fazer a comparação de atributos
- Mensagens na tela após cada rodada e Alerta após a finalização de 5 Rounds. Informando quem foi o vencedor
- Ao lado esquedo da tela tem um botão de regras/rules, onde ao clicar o usuário verá a seguinte mensagem explicativa:
Clique no Card do seu Pokémon e escolha um Atributo. Se a pontuação for maior que a do seu oponente >> Você Vence!!
- Alerta de Sucesso ou erro nas operações caso ocorram
- Página de erro caso navegue por uma página não existente Loading em todas as páginas
- Responsividade Funcional
Siga o passo-a-passo abaixo:
Passo | Comando |
---|---|
Faça o Clone | git clone |
Instale as Dependências | npm install |
Utilize o Script Start | npm start |
Por padrão a aplicação rodará localmente na porta 3000.
- axios
- react-icons
- react-router-dom
- styled-components
- sweet-alert
Home
Paginação
Alert ao capturar um Pokémon
Um Pokémon não pode ser adicionado à Pokedex duas vezes
Pokedex
Pokemon sendo removido
Página de detalhes
Pagina de Batalha / Regras
Parte frontal do card
Escolhendo atributo
Após 5 Rounds
Jil Mayumi Moutinho | Mariana Andrade | Talita Leonardo Miguel |