This Pokédex React App is a web application that allows users to browse and view details about different Pokémon. It uses the PokéAPI to fetch Pokémon data and display it in an interactive grid format.
- Display a grid of Pokémon with their images, names, numbers, and types
- Show animated sprites for a more engaging user experience
- View detailed information about each Pokémon by clicking on their card
- Responsive design for various screen sizes
- Dark theme for comfortable viewing
- React
- JavaScript (ES6+)
- CSS3
- PokéAPI
- Node.js (v14.0.0 or later)
- npm (v6.0.0 or later)
- Clone the repository:
git clone https://github.com/yourusername/pokedex.git - Navigate to the project directory:
cd pokedex - Install the dependencies:
npm install - Start the development server:
npm start - Open http://localhost:3000 in your browser to view the app.
- Scroll through the grid to view different Pokémon
- Click on a Pokémon card to view more detailed information
- Close the detailed view by clicking outside the modal or on the close button
The Pokédex design is inspired by and based on the work of Gustavo da Silva Rodrigues. The original Figma design can be found here.
Contributions are welcome! Please feel free to submit a Pull Request.
- Fork the repository
- Create your feature branch (
git checkout -b feature/AmazingFeature) - Commit your changes (
git commit -m 'Add some AmazingFeature') - Push to the branch (
git push origin feature/AmazingFeature) - Open a Pull Request
This project is licensed under the MIT License - see the LICENSE.md file for details.
- PokéAPI for providing the Pokémon data
- Create React App for the initial project setup
- Gustavo da Silva Rodrigues for the Pokédex design inspiration
- Implement pagination or infinite scrolling for better performance with large datasets
- Add more detailed information and stats in the Pokémon detail view
- Create a compare feature to view stats of multiple Pokémon side by side