Apex Legends Project

Projeto voltado à disciplina de Programação Web do curso de Sistemas de Informação da UFRN.

💻 Tecnologias Utilizadas

• 🚀 JavaScript
• ⏩ Next.js
• 🟢 Node.js
• ⚛️ React
• 🎨 CSS
• 🔥 Firebase

📚 Sobre o projeto

O sistema web desenvolvido é baseado em um jogo de FPS (First Person Shooter) chamado Apex Legends, disponível na EA Play. O seguinte site funciona tendo uma tela inicial, a qual possibilita ao usuário a navegação entre a tela de lendas (personagens), armas, mapas, login e minha coleção. Caso o usuário já possua uma conta e esteja logado, ele poderá acessar todas as telas disponíveis, caso contrário, será redirecionado à página de login, para que assim, possa entrar em sua conta. Entretanto, se o usuário não for cadastrado e não possuir uma conta, será preciso que o mesmo realize o cadastro no sistema. Por fim, para cadastrar-se no sistema, parte-se da tela de login ao clicar no botão "criar conta".

Na tela de lendas são listados vários cards com todos os personagens que existem no jogo. O usuário poderá pesquisar cada personagem por nome ou por classe (assalto, batedor combate, controle e suporte), se assim desejar. Ao clicar no card, o sistema redireciona para a tela de dados das lendas, onde há todas as informações sobre o personagem. Além disso, nessa tela também é possível favoritar a sua lenda preferida para adicioná-la à "minha coleção".

Na tela de armas serão exibidos alguns cards que representam a classe das armas que existem no jogo, e ao clicar no card, o usuário é direcionado à página onde são exibidas as armas da classe escolhida. Além disso, o sistema também permite favoritar as armas que mais o agradem.

Na tela de mapas, diferente das outras, ela apenas lista os mapas que compõem a ambientação do jogo com a opção de favoritá-los. E, por último, o site permite que o usuário, a partir da tela inicial, possa escolher visualizar a sua própria coleção, onde serão mostrados todos os itens favoritados de acordo com a coleção escolhida "lendas", "armas" ou "mapas", contendo, em cada card da tela de "minha coleção", a opção de exclusão dos favoritos.

🛠️ Como acessar?

• O site já está disponível e no ar para acesso livre, basta clicar neste link: apex-legends-project.vercel.app

Ou atente-se ao passo a passo a seguir:

1º Passo: Clonar o repositório

git clone https://github.com/FelipeSouza14/ApexLegends-Project.git

2º Passo: Instalar as tecnologias necessárias

npm install

3º Passo: Rodar o projeto em sua máquina

npm run dev

👨‍💻 Desenvolvedores

Felipe Souza	Isa Kaillany	Thamiris Borges

🔖 Layout

Você pode visualizar o layout do projeto através DESSE LINK. É necessário ter conta no Figma para acessá-lo.

📝 Licença

Esse projeto está sob a licença MIT.