Objetivo deste projeto é criar uma Pokedex totalmente responsiva, com paginação, filtro por tipo de pokemon, conectada à Poke API, manipulando múltiplas requisições em paralelo e com boas práticas para reduzir a verbosidade do código, consolidando meus estudos com API's RESTful
Foi utilizado o design que está no site Dribbble como inspiração na criação da minha pokedex
- Estilização da página de listagem
- Estilização inicial
- Estilização da listagem de Pokémon
- Adicionando a imagem do Pokémon
- Adicionando os tipos dos Pokémon e finalizando layout da imagem
- Melhorando estilização dos pokemon do tipo fogo
- Tornando layout responsivo
- Separando e organizando os estilos
-
Integrando com a Poke API
- Fazer requisição para pegar lista de pokémon
- Transformando a lista da API (JSON) em HTML
- Pegar nome do Pokemon e listar dinamicamente
- Separar consumo da API da manipulação de HTML
- Refatorando código com melhores práticas
- Fazer requisição para pegar os detalhes dos pokémon
- Pegar lista de tipos e adicionar dinamicamente
- Pegar imagem e adicionar dinamicamente
- Converter o modelo JSON da PokeAPi para o que será usado na aplicação
- Adicionando cor dos tipos dinamicamente
- Adicinando botão de paginação
- Criando mecanismo de paginação
- Criando mecanismo para limitar a listagem na primeira geração de pokémon
- Criar página ou modal para renderizar o pokemon selecionado com os detalhes
- Criar o header com nome, número, imagem, tipos e botão voltar
- Fazer estilização do nome, número botão voltar
- Posicionar foto do pokemon dentro do header, embaixo e centralizada
- Criar evento de abrir modal
- Criar evento de fechar o modal
- Criar seção de detalhes com menu 'About'
- Criar lista de detalhes do About
- Criar lista do Base Stats
- Mudar cor da barra de progressão
- Criar animação de abrir e fechar modal
- Refatorado forma de abrir modal
- Pegar todos os dados do pokemon na API
- Renderizar pokemon clicado de for dinamica
- Ajustar layout para ficar o mais próximo possível de proposto
Estas funcionalidades serão adicionadas futuramente
- Finalizando a listagem de pokémon
- Adicionando funcionalidade filtro pokemon por tipo
- Criar layout para a funcionalidade (botão ou menu)
- Criar a lógica para o filtro