Pokedex

screenshot of Pokedex
react
tanstack
vite
radix-ui

Pokédex React app that lets you discover and explore Pokémon based on PokéAPI.

Overview

The Pokédex React App is an engaging and interactive application that allows Pokémon enthusiasts to delve into the fascinating world of Pokémon using the PokéAPI. With a sleek design and user-friendly interface, this app makes it easy to explore various Pokémon, uncover their stats, learn about their evolutions, and more. Built with cutting-edge technologies like React.js and React Query, it provides an efficient browsing experience that keeps users coming back for more.

Whether you're a long-time Pokémon fan or just starting your journey, the Pokédex React App promises a delightful experience filled with rich content and smooth navigation. Get ready to discover your favorite Pokémon and their unique characteristics all in one place.

Features

  • Beautiful UI: The app boasts a visually appealing user interface inspired by designer Flavio Farias, enhancing the overall user experience.
  • Type-based Browsing: Easily browse Pokémon categorized by their types, making it simpler to find your favorites.
  • Detailed Modals: Clicking on a Pokémon opens a modal that presents in-depth information about that specific Pokémon, including images and descriptions.
  • About Tab: This section offers key insights about the selected Pokémon, giving users essential lore and background details.
  • Stats Tab: Displays the various statistical attributes and characteristics of the Pokémon, essential for both casual and competitive players.
  • Evolution Tab: Visualizes the evolutionary chain, showing how Pokémon evolve over time, perfect for those interested in their growth and transformation.
react
React

React is a widely used JavaScript library for building user interfaces and single-page applications. It follows a component-based architecture and uses a virtual DOM to efficiently update and render UI components

tanstack
TanStack

TanStack is a collection of high-quality, framework-agnostic libraries including TanStack Query for data fetching, TanStack Router for routing, TanStack Table for tables, and more. These tools provide powerful, type-safe solutions for common web development challenges.

vite
Vite

Vite is a build tool that aims to provide a faster and leaner development experience for modern web projects

radix-ui
Radix UI

Radix Primitives is a low-level UI component library with a focus on accessibility, customization and developer experience. You can use these components either as the base layer of your design system, or adopt them incrementally.

eslint
Eslint

ESLint is a linter for JavaScript that analyzes code to detect and report on potential problems and errors, as well as enforce consistent code style and best practices, helping developers to write cleaner, more maintainable code.