/consumo-api

Trabalho do curso de Desenvolvimento de Software Multiplataforma da FATEC Franca. Este projeto visa a demonstração dos conhecimentos adquiridos em sala de aula para desenvolver uma página em Vue que consuma uma API.

Primary LanguageCSS

💻 Consumo de API - Cartas de Yu-Gi-Oh!

🌐 Teste o projeto

https://consumo-api-yugioh.netlify.app/

📜 Sobre o projeto

Este projeto é uma aplicação web desenvolvida para consumir a API de cartas de Yu-Gi-Oh! disponibilizada pelo site YGOPRODeck (https://ygoprodeck.com/api-guide/). A aplicação permite aos usuários pesquisar e visualizar informações detalhadas sobre cartas do famoso jogo de cartas diretamente em seu navegador.

🎥 Vídeo demonstrativo

https://drive.google.com/file/d/1MmT3d0AS6ByixV3qudvvxkwQ-Nuqx5ct/view?usp=sharing

⚙️ Funcionalidades do projeto

Busca de Cartas

O usuário pode clicar no botão "Chamar Cartas" para buscar cartas diretamente da API. Isso evita carregar todas as cartas de uma vez, tornando a aplicação mais leve e rápida.

image

Exibição de Detalhes

Cada carta é exibida com sua imagem e nome. Ao passar o mouse sobre uma carta, uma descrição detalhada é mostrada, permitindo que o usuário leia mais sobre as características e efeitos da carta.

image

Carregamento Incremental

À medida que o usuário rola a página para baixo, mais cartas são carregadas automaticamente, evitando sobrecarregar a interface com muitas cartas de uma vez.

image

💾 Tecnologias Utilizadas

HTML e CSS: Para a estrutura e estilo da página.

JavaScript com Vue.js: Para criar uma aplicação reativa e gerenciar as interações do usuário.

API YGOPRODeck: Para buscar dados atualizados das cartas de Yu-Gi-Oh! em português.