Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/kiranwankhade/mynextdeveloper_pokemon_api

This is a web application built using React.js and Chakra UI, designed to interact with the PokeAPI (https://pokeapi.co/).
https://github.com/kiranwankhade/mynextdeveloper_pokemon_api

chakra-ui react react-router-dom reactjs

Last synced: about 16 hours ago
JSON representation

This is a web application built using React.js and Chakra UI, designed to interact with the PokeAPI (https://pokeapi.co/).

Awesome Lists containing this project

README

        

# Pokemon Web Application

This is a web application built using React.js and Chakra UI, designed to interact with the PokeAPI (https://pokeapi.co/).

## Features

- **Homepage:**
- Search bar: Allows users to search for a Pokemon.
- Random Pokemon card: Displays a random Pokemon card below the search bar, which changes daily for every user but not on every refresh.

- **Search Results Page:**
- List of Pokemon: Displays a list of Pokemon that match the user's search.

- **Details Page:**
- Attributes: Displays all attributes associated with the selected Pokemon.

## Installation

1. Clone this repository to your local machine:

```bash
git clone https://github.com/kiranwankhade/myNextDeveloper_Pokemon_Api.git
```

2. Navigate into the project directory:

```bash
cd myNextDeveloper_Pokemon_Api
```

3. Install dependencies using npm or yarn:

```bash
npm install
```

## Usage
1. Start the development server:

```bash
npm start
```
2. Open your web browser and navigate to http://localhost:3000 to view the application.

## ScreenShot of the app

![PANew1](https://github.com/kiranwankhade/myNextDeveloper_Pokemon_Api/assets/49937312/77687a4a-f069-4b92-b7c6-f68dc386f7f6)

![PANew4](https://github.com/kiranwankhade/myNextDeveloper_Pokemon_Api/assets/49937312/ab80a0f0-0c56-4f85-b89f-3fcc7ff1c281)

![PANew2](https://github.com/kiranwankhade/myNextDeveloper_Pokemon_Api/assets/49937312/2f51e5ab-c224-4eb3-aa7a-24f9bd28a448)

![PANew5](https://github.com/kiranwankhade/myNextDeveloper_Pokemon_Api/assets/49937312/5457e081-1874-4adb-8332-cdd178ce2c47)

![PANew3](https://github.com/kiranwankhade/myNextDeveloper_Pokemon_Api/assets/49937312/2d928d4e-e569-44a5-bf22-c398907a5f3e)

![PANew6](https://github.com/kiranwankhade/myNextDeveloper_Pokemon_Api/assets/49937312/c5b64425-4884-49fc-a4d4-8fa8a15ad585)