https://github.com/tsukiyama-3/pokedex

A practical example of creating a Pokémon encyclopedia using Nuxt 3, PokeAPI, and TypeScript. This project demonstrates clean architecture principles and type-safe API integration.
https://github.com/tsukiyama-3/pokedex

javascript nuxt nuxt3 nuxtjs pokeapi pokedex pokemon tailwindcss ts typescript vue vue3 vuejs zod

Last synced: 3 months ago
JSON representation

A practical example of creating a Pokémon encyclopedia using Nuxt 3, PokeAPI, and TypeScript. This project demonstrates clean architecture principles and type-safe API integration.

• Host: GitHub
• URL: https://github.com/tsukiyama-3/pokedex
• Owner: tsukiyama-3
• Created: 2025-01-04T15:35:28.000Z (10 months ago)
• Default Branch: main
• Last Pushed: 2025-02-23T05:54:53.000Z (8 months ago)
• Last Synced: 2025-04-23T08:08:48.796Z (6 months ago)
• Topics: javascript, nuxt, nuxt3, nuxtjs, pokeapi, pokedex, pokemon, tailwindcss, ts, typescript, vue, vue3, vuejs, zod
• Language: TypeScript
• Homepage: https://pokedex.nuxt.dev/
• Size: 394 KB
• Stars: 4
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

          
# 🚀 PokeDex - A Nuxt 3 Project

https://pokedex.nuxt.dev/

A practical example of creating a Pokémon encyclopedia using Nuxt 3, PokeAPI, and TypeScript. This project demonstrates clean architecture principles and type-safe API integration.

# 📘 Zenn Book



https://zenn.dev/tsukiyama3/books/pokedex-handson

# ✨ Features

- Pokemon List Page

  Displays a list of Pokémon with their names, images, and types.

  ![](https://res.cloudinary.com/dyoyv8djx/image/upload/v1736010904/PokeDex/%E3%82%B9%E3%82%AF%E3%83%AA%E3%83%BC%E3%83%B3%E3%82%B7%E3%83%A7%E3%83%83%E3%83%88_2025-01-05_1.55.32_jlkt58.png)

- Pokemon Detail Page

  Shows detailed information about a selected Pokémon, including its stats, abilities, and more.

  ![](https://res.cloudinary.com/dyoyv8djx/image/upload/v1736010904/PokeDex/%E3%82%B9%E3%82%AF%E3%83%AA%E3%83%BC%E3%83%B3%E3%82%B7%E3%83%A7%E3%83%83%E3%83%88_2025-01-05_1.55.44_hgso0n.png)

# 🛠️ Tech Stack

- Nuxt 3: The foundation of the project, providing a modern web development framework.

- PokeAPI: The source of all Pokémon data used in this application.

- TypeScript: Ensures type safety and cleaner code.

- TailwindCSS: Provides responsive and utility-first styling.

- Clean Architecture: A structured approach to organizing the codebase for scalability and maintainability.

# 📦 Installation

1. Clone the repository

```

git clone https://github.com/tsukiyama-3/pokedex.git

cd pokedex

```

2. Install dependencies

```

npm install

```

3. Start the development server

```

npm run dev

```