markdown

Pokémon TCG Web

Bem-vindo ao Pokémon TCG Web – o portal onde cada carta é uma aventura e cada clique revela novos universos! Se você já sonhou em ser o mestre dos cards, este projeto é a trilha iluminada que o levará a jornadas épicas no mundo do Pokémon Trading Card Game.

Sumário

• Introdução
• Recursos do Projeto
• Pré-requisitos
• Instalação
  • 1. Clonando o Repositório
  • 2. Instalando as Dependências
  • 3. Configurando as Variáveis de Ambiente
  • 4. Configuração do Banco de Dados
• Como Usar
  • Rodando a Aplicação
  • Navegando pela Interface
• Estrutura do Projeto
• Contribuição
• Licença

Introdução

O Pokémon TCG Web foi concebido com a paixão de um verdadeiro treinador e a precisão de um código bem escrito. Este projeto possibilita que você explore, busque e gerencie cartas do Pokémon Trading Card Game com uma interface moderna, responsiva e carregada de personalidade. Embarque nesta jornada digital e descubra segredos ocultos em cada carta!

Recursos do Projeto

• Consulta de Cartas: Explore uma vasta coleção com detalhes únicos de cada carta.
• Filtros Avançados: Refine suas buscas por tipo, raridade, expansão e muito mais.
• Interface Responsiva: Uma experiência fluida em qualquer dispositivo, seja desktop ou mobile.
• Integração com API: Dados atualizados e dinâmicos para manter sua coleção sempre em dia.
• Banco de Dados SQL: Armazene e gerencie as informações das cartas e dos usuários utilizando MySQL via XAMPP e phpMyAdmin.
• Design Inspirador: Uma pitada de poesia no código, que transforma cada clique em uma experiência quase mágica.

Pré-requisitos

Antes de iniciar sua jornada, garanta que sua máquina esteja equipada com:

• Node.js (versão 14 ou superior)
• npm ou Yarn
• XAMPP instalado para rodar o MySQL e gerenciar o banco de dados via phpMyAdmin

Instalação

1. Clonando o Repositório

Abra o terminal e execute o comando para clonar o repositório:

git clone https://github.com/lucasouzadev/Pokemon-TCG-Web.git

2. Instalando as Dependências

Navegue até a pasta do projeto:

cd Pokemon-TCG-Web

Observação: Se o projeto estiver estruturado em múltiplas pastas (por exemplo, client e server), siga os passos abaixo para cada ambiente.

Para um Projeto Monolítico

Instale as dependências na raiz do projeto:

npm install

Para Estrutura com Front-end e Back-end Separados

• Front-end:

  cd client
  npm install

• Back-end (se aplicável):

  cd ../server
  npm install

3. Configurando as Variáveis de Ambiente

Crie um arquivo .env na raiz ou na pasta do back-end e configure as variáveis necessárias. Por exemplo:

# Exemplo de configuração para o back-end
PORT=5000
DB_HOST=localhost
DB_USER=seu_usuario
DB_PASSWORD=sua_senha
DB_DATABASE=pokemon_tcg
JWT_SECRET=sua_chave_secreta

Ajuste as variáveis conforme sua configuração local.

4. Configuração do Banco de Dados

Este projeto utiliza MySQL para armazenar os dados das cartas e dos usuários. Após instalar o XAMPP, siga os passos abaixo:

1. Acesse o phpMyAdmin: Abra seu navegador e vá para http://localhost/phpmyadmin.
2. Crie o Banco de Dados: Crie um novo banco de dados com o nome especificado na variável DB_DATABASE (por exemplo, pokemon_tcg).
3. Importe as Tabelas: Caso haja um arquivo SQL (como um dump ou script de criação de tabelas) no diretório /database, importe-o para criar as tabelas necessárias. Se não houver, siga as instruções da documentação do projeto para executar as migrations ou criar as tabelas manualmente.

Como Usar

Rodando a Aplicação

Ambiente Unificado

Se o projeto for monolítico, basta iniciar com:

npm start

Ambientes Separados

• Back-end: Inicie o servidor:

  cd server
  npm start

  O servidor, por padrão, rodará em http://localhost:5000.

• Front-end: Inicie a interface do usuário:

  cd ../client
  npm run dev

  A aplicação estará disponível em http://localhost:3000 ou na porta configurada.

Navegando pela Interface

1. Acesse a Aplicação: Abra seu navegador e vá para http://localhost:3000.
2. Explore o Catálogo: Utilize os filtros avançados para encontrar cartas por tipo, raridade ou expansão.
3. Detalhes da Carta: Clique em qualquer carta para visualizar detalhes, estatísticas e informações adicionais.
4. Interação Personalizada: Caso o sistema permita, faça login ou registre-se para salvar sua coleção e ter uma experiência única.

Estrutura do Projeto

Uma breve visão da organização do repositório:

• /client: Código fonte do front-end, com componentes, estilos e assets.
• /server: Código do back-end, incluindo a API, modelos de dados e rotas.
• /database: Scripts ou arquivos SQL para criação e gerenciamento do banco de dados.
• /public: Arquivos estáticos como imagens e ícones.
• package.json: Gerenciamento de dependências e scripts para automação.

Contribuição

Sua contribuição é a faísca que mantém esta jornada viva! Se deseja aprimorar o projeto:

1. Fork este repositório.

2. Crie uma branch para sua feature:

   git checkout -b feature/nova-funcionalidade

3. Realize suas alterações e faça commit:

   git commit -m "Adiciona nova funcionalidade"

4. Envie sua branch para o repositório remoto:

   git push origin feature/nova-funcionalidade

5. Abra um Pull Request para que sua contribuição seja revisada e integrada.

Licença

Este projeto está licenciado sob a MIT License. Sinta-se à vontade para usar, modificar e distribuir o código, mas lembre-se: com grandes poderes vêm grandes responsabilidades!

---

Que sua jornada pelo universo Pokémon seja repleta de inspiração, descobertas e muitas vitórias – afinal, cada card é um poema e cada batalha, uma obra de arte!