← Projects

September 24, 2026

Japanese Pokémon Card Companion

Overview

A personal Progressive Web App for browsing the Japanese Pokémon TCG catalogue from my phone while shopping in Japan, without being able to read Japanese. It also tracks the value of my collection using Cardmarket prices.

Key Features

  • Search in Spanish or English: names are mapped to their Japanese equivalents using PokeAPI, so "Iron Thorns" finds テツノイバラ.
  • Complete catalogue: TCGdex data, extended with ~190 sets it lacks (decks, promos, 30th Celebration) that are matched and validated card by card.
  • Offline mode: a service worker and a one-tap "prepare offline" download for use in shops without signal.
  • Collection and price history: a daily cron job records Cardmarket trend prices and the collection's total value, shown as charts.
  • Single-user access: stateless HMAC-signed session cookie, enforced by edge middleware before any page, API route or image is served.

Technologies Used

  • React 19 + Vite + TypeScript: frontend and PWA
  • Vercel: hosting, serverless functions, routing middleware and cron jobs
  • Upstash Redis: collection sync and price history
  • Cloudflare R2: private bucket holding a permanent copy of ~42,500 card images, served through an authenticated endpoint

Challenges and Learnings

The hardest part was image coverage: no single free source has every Japanese card. The app falls back through several sources in order, and older sets are matched between catalogues by comparing card names through species rather than by set codes. This catches mismatches that a naive code or date comparison would miss.