⚡ Pokémon Explorer - Fullstack React Project

A fully responsive and dynamic Pokémon Explorer App built with React, React Router, and PokéAPI integration. This project is part of my job preparation journey to demonstrate my understanding of real-world frontend development, dynamic routing, state management, and REST API integration.

---

✅ Project Objectives

• Practice React Router for dynamic routing
• Implement API integration with useEffect and async/await
• Build a responsive UI using Tailwind CSS or Bootstrap
• Work with local storage to manage favorite Pokémon
• Showcase job-ready skills in a complete project structure

---

🔥 Key Features

• Homepage – Fetch and list 50 Pokémon from PokéAPI with images and names
• Search Bar – Filter Pokémon in real-time by name
• Dynamic Details Page – /pokemon/:name route with full Pokémon stats
• Favorites – Save/remove Pokémon to local storage with a dedicated /favorites page
• Navigation Bar – Easy navigation between pages
• Responsive UI – Built with modern styling tools

---

🛠️ Tech Stack

• React (Hooks, useState, useEffect, useParams)
• React Router DOM
• JavaScript ES6+
• Tailwind CSS or Bootstrap (optional)
• REST API integration (PokéAPI)
• Local Storage

---

📂 Project Structure (Frontend)

src/ ├── components/ │ ├── Navbar.js │ └── PokemonCard.js ├── pages/ │ ├── Home.js │ ├── PokemonDetail.js │ └── Favorites.js ├── App.js └── index.js

---

🧠 What I Learned

• How to work with REST APIs in real-world apps
• React Router v6 for dynamic routes and URL params
• Using useEffect for fetching data
• State persistence with Local Storage
• Clean project structuring and reusable components

---

🚀 How to Run

git clone https://github.com/your-username/pokemon-explorer
cd pokemon-explorer
npm install
npm start

🎯 Future Improvements

Add pagination for more Pokémon

Add sorting by base stats or name

Filter Pokémon by type

    Include testing with Jest and React Testing Library

🧑‍💻 About Me

Hi, I'm Sunit – a passionate web developer aiming for MERN stack opportunities.
This is one of the projects I'm building to demonstrate my readiness for real-world frontend development.

    📫 Email: fullstack@gmail.com

    🌐 Portfolio: your-portfolio-link.com

    💼 LinkedIn: your-linkedin.com/in/sunit