Your ultimate digital companion for exploring Pokémon species, analyzing competitive squads, and mastering evolution chains.
Hey fellow Trainers! 👋 Welcome to PokéDex. I built this project because I wanted a smooth, modern, and genuinely useful PokéDex that goes beyond just listing basic stats.
Built with Next.js 16 and React 19, it's designed to feel less like a static wikia and more like a high-tech tool you'd actually carry on your journey. Whether you're casually looking up evolution requirements, studying type matchups, or deep-diving into competitive team building with the built-in Squad Analyzer, everything is delivered through a crisp, glassmorphic UI that runs lightning fast.
Important
Data is powered by the incredible PokeAPI, bringing you real-time, accurate info for over 1025+ Pokémon across all 9 generations.
Here's what you can do with PokéDex:
| Feature | What it does |
|---|---|
| 📚 Complete Encyclopedia | Everything from Bulbasaur to Pecharunt. All stats, base experience, height/weight, and abilities. |
| 🧬 Evolution Tracking | No more guessing how to evolve an Eevee. Get clear visual pathways and exact requirements (levels, items, friendship, day/night) for every single evolution branch. |
| ⚔️ Squad Analyzer | The real game-changer. Build your dream team of 6, calculate their actual Level 100 stats, and get instant competitive feedback and synergy scoring. |
| 🎯 Type Matchup Calculator | Instantly analyze offensive and defensive advantages so you never bring a Grass type to a Fire fight. |
| 📱 PWA Functionality | Install PokéDex right to your phone's home screen. It feels just like a native app! |
| 🎨 Premium UI/UX | A crafted, clean, non-glowing yellow themed aesthetic with a compact glassmorphic dashboard that simply feels good to use. |
I've used a modern stack to make sure this application is as fast and robust as possible:
- Framework: Next.js 16 (Making full use of the App Router & Server Components)
- Library: React 19
- Styling: Tailwind CSS v4 for that snappy, utility-first design.
- UI Components: Radix UI primitives wrapped in custom glassmorphic styling, plus Lucide React for crisp icons.
- Data Source: The community-driven PokeAPI.
Want to run PokéDex locally? It's super easy.
Make sure you have Node.js installed on your machine.
Clone the repository and install the dependencies:
git clone https://github.com/adityajha-coder/PokeDex-DB.git
cd PokeDex
npm installYou'll need to set up a env file.
Start the development server:
npm run devThen, open http://localhost:3000 in your browser, and you're good to go!
For the curious developers diving into the codebase:
.
├── 📂 app # Next.js App Router (Pages, Layouts, & API Routes)
├── 📂 components # Where the magic happens (Reusable UI)
│ ├── 📂 pokemon # Domain-specific components (Squad Builder, Details, Cards)
│ └── 📂 ui # Radix UI / Shadcn base components
├── 📂 hooks # Custom React hooks for state and data fetching
├── 📂 lib # Shared utilities (like type matchup logic & helpers)
├── 📂 public # Static assets (including the PWA manifest)
└── 📂 styles # Global CSS and Tailwind directives
Feel free to fork this project, submit PRs, or open issues if you find any bugs or have feature requests. I'm always open to making this tool better!
"To catch them is my real test, to train them is my cause!" 🧢⚡️
Built by a Trainer, for Trainers everywhere.