Project1025

A mobile-first Pokédex tracker for building and managing a complete Pokémon card collection

SNES Hero

Story

I grew up watching Pokémon, playing the games, and collecting cards, but gradually drifted away from the hobby. A trip to Japan inspired me to start collecting again and left me looking for a more purposeful way to organize the bulk cards I already owned.

Around the same time, I discovered DeepPocketMonster's Pokédex Challenge: collect one card for every Pokémon. I began tracking my own collection in a spreadsheet, but the workflow broke down at card shows and local shops. Updating hundreds of rows on a phone was slow, and checking which Pokémon were still missing took too many steps.

I built Project1025 as a faster, mobile-first alternative. The app lets me check collection progress, find missing Pokémon, maintain a wishlist, and select the specific card used for each Pokédex entry while I am actively browsing cards.

Design

Mobile Collection Workflow

The primary use case is checking the collection while walking through a convention or card shop, so the interface is designed around short mobile interactions. Pokémon can be browsed by region or found through a full Pokédex search, while progress indicators make completed and missing entries easy to identify at a glance.

Data and Persistence

The application uses Next.js, React, and TypeScript. Supabase provides the PostgreSQL database used to persist collection entries, selected cards, and wishlist state. The data model separates a Pokémon's Pokédex entry from the specific card assigned to it, allowing each entry to be updated without changing the overall collection structure.

Card Search and Caching

Card information and artwork are retrieved from the Pokémon TCG API. Frequently requested results are cached in Supabase so repeated searches do not depend on a new external API request. This reduces latency on mobile connections and keeps the browsing experience responsive while limiting unnecessary API traffic.

Technologies

  • Next.js & React
  • TypeScript
  • Tailwind CSS
  • Supabase (PostgreSQL Database)
  • Pokémon TCG REST API
  • API Response Caching
  • Responsive Mobile-First UI Design
  • Component-Based Architecture
  • State Management with React Hooks