Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/lucky-bhure/pokemon-card
A Pokémon Card Static Website is a fast, simple webpage showcasing Pokémon cards with a gallery layout and key details like name, type, and abilities. It may include search and filter options for easy browsing by Pokémon name.
https://github.com/lucky-bhure/pokemon-card
Last synced: about 1 month ago
JSON representation
A Pokémon Card Static Website is a fast, simple webpage showcasing Pokémon cards with a gallery layout and key details like name, type, and abilities. It may include search and filter options for easy browsing by Pokémon name.
- Host: GitHub
- URL: https://github.com/lucky-bhure/pokemon-card
- Owner: Lucky-Bhure
- Created: 2024-11-22T08:59:39.000Z (about 1 month ago)
- Default Branch: master
- Last Pushed: 2024-11-22T09:32:08.000Z (about 1 month ago)
- Last Synced: 2024-11-22T10:26:00.020Z (about 1 month ago)
- Language: JavaScript
- Homepage: https://pokemon-card-eosin.vercel.app
- Size: 154 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Pokémon-Card Application
A Pokémon Card Static Website is a fast, simple webpage showcasing Pokémon cards with a gallery layout and key details like name, type, and abilities. It may include search and filter options for easy browsing by Pokémon name.
## Features
- Fetches data for 225 Pokémon using the [Pokémon API](https://pokeapi.co/api/v2/pokemon?limit=225).
- Displays Pokémon details, including images, name, type, height, weight, speed, abilities, and stats.
- Search functionality to filter Pokémon by name in real-time.
- Responsive and visually appealing card design.
## Technologies Used
- **React**: For building the UI components.
- **JavaScript (ES6+)**: Core language for functionality.
- **CSS**: For styling the components.
- **Pokémon API**: For fetching Pokémon data.
## Installation and Setup
Follow these steps to run the application locally:
1. **Clone the repository**:
```bash
git clone https://github.com/Lucky-Bhure/Pokemon-Card.git
cd Pokemon-Card
2. **Install dependencies: Make sure you have Node.js installed:**
```bash
npm install
3. **Start the development server:**
```bash
npm run dev
The application will be available at http://localhost:5173
## Usage
On loading the app, it fetches and displays a list of 225 Pokémon.
Use the search bar at the top to filter Pokémon by name.
Click on a Pokémon card to view its details, such as stats, abilities, and more.
## License
This project is licensed under the MIT License. Feel free to use and modify it as needed.