Skip to content

Latest commit

 

History

History
79 lines (49 loc) · 2.76 KB

File metadata and controls

79 lines (49 loc) · 2.76 KB

Game API Viewer 🎮

Sobre

Projeto feito com ReactJS + Tailwind CSS + React Router que pega a API RAWG (uma API com dados sobre jogos) e mostra em uma tabela. Nesta tabela pode-se fazer muitas ações, como: filtrar por gênero e plataformas dos jogos, ordenar por coluna, pesquisar e muito mais.

Tecnologias

Aqui estão as tecnologias usadas neste projeto.

  • react 18.2.0
  • react-router-dom 6.3.0
  • tailwindcss 3.1.8
  • react-icons 4.4.0

Serviços utilizados

  • Git e Github
  • Vite 3.0.7

Como utilizar

(OBS) Este projeto foi feito utilizando o yarn como administrador de pacotes.

  • Clone o projeto para sua máquina.
  • Digite "yarn" sem as aspas no terminal do seu editor estando na pasta clonada (este processo instalará as dependencias necessárias).
  • Digite "yarn dev" sem as aspas no terminal para rodar a aplicação.

Imagens do Projeto

1 - Tela de boas-vindas.

2 - Tela principal.

3 - Filtrar os dados da tabela usando a barra de pesquisa.

4 - É possível filtrar os dados da tabela por gêneros e plataformas suportadas.

5 - É possível ordenar os dados clicando no nome da coluna.

6 - Expandindo os dados de cada célula (ou do card ao lado) quando o mouse passa por cima.

7 - Em caso de overflow de dados um componente de paginação surgirá.

Este website também é totalmente responsivo, ou seja, se adapta a diversos tamanhos de dispositivos.

Segue abaixo as imagens do website em um dispositivo móvel.

Autor

  • David Alves Soares

Por favor, siga me no GitHub para acompanhar meus futuros projetos.

Obrigado por ter vindo até aqui, desejo tudo de bom para você!