Inspiration

Our love for Pokémon and the desire to combine learning and fun inspired us to build a modern Pokedex using Next.js. What it does

The Pokedex lets users search for and explore detailed information about Pokémon, including names, types, stats, abilities, and images. It also features filtering by type and a fast search function. How we built it

We used Next.js for its server-side rendering (SSR) and performance. Data is fetched from the PokéAPI, styled with CSS Modules, and made interactive with React. We utilized API routes for efficient data handling.

Challenges we ran into Navigating and structuring complex data from the PokéAPI. Optimizing images for fast loading while maintaining quality. Balancing SSR and client-side rendering for performance.

Accomplishments that we're proud of

We created a fast, responsive Pokedex with seamless search and filtering, while maintaining a visually appealing design. What we learned

We enhanced our skills in API integration, data optimization, and using Next.js features like dynamic routes and SSR effectively. What's next for Pokedex

Future plans include adding favorites, comparison tools, interactive games, multi-language support, and potential AR integration to visualize Pokémon in the real world.

GitHub: https://github.com/PauGallego/Code-Zero Presentation: https://pitch.com/v/hackathon-code-zero-q5cs49

Built With

Share this project:

Updates