This is a Pokedex website project that utilizes the following technologies: pokeapi, Next.js 13, Tailwind CSS, React Query, and TypeScript. The website provides various features to explore and search for Pokemon.
The Pokedex website offers the following features:
-
Sorting Pokemon:
- Sort Pokemon by generation: Users can view Pokemon categorized by their respective generations.
- Sort Pokemon by type: Users can filter and display Pokemon based on their types.
-
Searching Pokemon:
- Search Pokemon by name: Users can search for specific Pokemon by their names.
-
Dark theme toggle:
- Users can toggle between light and dark themes.
-
Pokemon Page:
- Upon entering a Pokemon's page, users can find detailed information about that Pokemon, including:
- Name: The name of the Pokemon.
- ID: A unique identifier for the Pokemon.
- Types: The elemental types associated with the Pokemon.
- Stats: Various statistical attributes of the Pokemon, such as HP, attack, defense, etc.
- Resistance and Weakness: Information about the Pokemon's strengths and weaknesses against different types.
- Evolution Chain: The evolutionary lineage of the Pokemon, showcasing its pre-evolved and evolved forms.
- Moves: The moves or abilities the Pokemon can learn and use.
- Upon entering a Pokemon's page, users can find detailed information about that Pokemon, including:
The Pokedex website is built using the following technologies:
- PokeAPI: An API that provides data about Pokemon, including their characteristics, abilities, and more.
- Next.js 13: A React framework that enables server-side rendering, static site generation, and other powerful features.
- Tailwind CSS: A utility-first CSS framework that allows for rapid and efficient styling of web pages.
- React Query: A library for managing, caching, and syncing asynchronous data in React applications.
- TypeScript: A statically-typed superset of JavaScript that enhances development experience and catches potential errors.
The Pokedex website is currently deployed at pokedex-xi-ruby.vercel.app.
The project utilizes the PokeAPI as the source of Pokemon data.