https://github.com/robertcastro86/pokedex-app
O projeto foi criado com foco na experiência do usuário, oferecendo navegação fluida, design responsivo e a funcionalidade de alternar entre temas claro e escuro, proporcionando uma experiência personalizada para cada usuário.
https://github.com/robertcastro86/pokedex-app
javascript pokemon-api react-router reactjs rest-api styled-components
Last synced: about 2 months ago
JSON representation
O projeto foi criado com foco na experiência do usuário, oferecendo navegação fluida, design responsivo e a funcionalidade de alternar entre temas claro e escuro, proporcionando uma experiência personalizada para cada usuário.
- Host: GitHub
- URL: https://github.com/robertcastro86/pokedex-app
- Owner: RobertCastro86
- Created: 2025-07-13T21:26:15.000Z (12 months ago)
- Default Branch: main
- Last Pushed: 2025-07-13T22:51:59.000Z (12 months ago)
- Last Synced: 2025-07-13T23:32:59.410Z (12 months ago)
- Topics: javascript, pokemon-api, react-router, reactjs, rest-api, styled-components
- Language: JavaScript
- Homepage: https://pokedex-app-gamma-azure.vercel.app/
- Size: 186 KB
- Stars: 0
- Watchers: 0
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# 🔥 Pokédex App
Uma Single Page Application (SPA) para listagem e visualização de detalhes de Pokémons utilizando a PokéAPI.
## 🚀 Funcionalidades
- **Listagem de Pokémons**: Exibe 10 pokémons iniciais com imagem e nome
- **Carregamento incremental**: Botão "Carregar mais" para buscar mais 10 pokémons
- **Detalhes do Pokémon**: Página com informações completas (movimentos, habilidades, tipos)
- **Alternador de tema**: Botão para alternar entre tema claro e escuro
- **Navegação**: Sistema de rotas para navegação entre páginas
## 🛠️ Tecnologias Utilizadas
- **React.js** - Biblioteca principal para construção da interface
- **Context API** - Gerenciamento de estado do tema (claro/escuro)
- **styled-components** - Estilização dos componentes
- **react-router-dom** - Navegação entre páginas
- **PokéAPI** - API para dados dos pokémons
## 📦 Instalação
```bash
# Clone o repositório
git clone https://github.com/seu-usuario/pokedex-app.git
# Navegue até o diretório
cd pokedex-app
# Instale as dependências
npm install
# Execute o projeto
npm start
```
## 🎯 Estrutura
### Página Inicial (Home)
- Lista de pokémons com imagem e nome
- Botão "Carregar mais" para paginação
- Cada pokémon é clicável para acessar os detalhes
### Página de Detalhes
- Imagem do pokémon
- Nome
- Lista de movimentos
- Lista de habilidades com descrições
- Tipos do pokémon
## 🎨 Temas
A aplicação possui dois temas:
- **Branco**: Fundo branco com texto escuro
- **Preto**: Fundo escuro com texto claro
O tema é alternado através do botão no cabeçalho da aplicação.
## 📱 Responsividade
Interface responsiva que se adapta a diferentes tamanhos de tela.
## 🔗 API
Utiliza a [PokéAPI](https://pokeapi.co/) para buscar dados dos pokémons.
---
Desenvolvido por Robert Castro com ❤️ usando React.js