Ho comprato quasi per gioco qualche carta di One Piece: molto bello!
Ma potevo fermarmi qui? Ne ho fatto una web app e ho scoperto nuove cose!
Premessa
I giochi di carte mi hanno sempre attirato, sia dal punto di vista ludico che collezionistico. Parecchi anni fa mi divertivo con Magic ma ora, non volendo riaprire quel capitolo, volevo buttarmi su qualcos’altro. Un po’ perchè i Pokemon non li tollero più di tanto e un po’ perchè mi piace di più infilarmi in un settore un tantino più “di nicchia”, ho pensato di comprare qualche carta di One Piece The Card Game.
Per chi non conoscesse il manga di One Piece (di Eiichiro Oda), consiglio davvero di dedicare un piccolo approfondimento perchè si tratta di una storia davvero affascinante e di un prodotto davvero ben realizzato, longevo e sempre interessante e creativo.
Essendo questo gioco ancora poco conosciuto o comunque poco diffuso dalle nostre parti, ho dovuto acquistarne qualche pezzo qua e là, per lo più utilizzando Ebay o simili. La cosa carina è che ho iniziato con dei deck “precostruiti” (Starter Deck) che, seppur avessero una limitata possibilità di acquisre di valore in senso monetario stretto, mi hanno permesso di comprendere abbastanza bene il mercato su cui mi stavo affacciando e cominciare a toccare con mano le carte, apprezzandone la qualità.
Devo infatti dire che, le carte sono fatte molto bene, i disegni sono davvero belli e le finiture, soprattutto nelle carte foil, sono davvero efficaci e ben curate e i caratteri giapponesi esercitano sempre il loro fascino su chi ne apprezza l’aspetto grafico/artistico. Io ne sono vittima. Ah, le carte le ho acquistate tutte in lingua Giapponese sebbene le versioni inglesi siano abbastanza diffuse.
Ho cominciato con il primo, il secondo, il terzo, il quarto deck… Poi ne ho saltato qualcuno; ne ho presi altri sparsi, ho preso un po’ di bustine di vari set e qualche display box (ovvero set di parecchie bustine). E ho, per ora, un migliaio di carte.
Ma come tenerle in ordine? Come gestirle? Cosa farne?
Con dei raccoglitori. E con una web app.
I raccoglitori
I raccoglitori sono qualcosa del genere:
Con dei fogli porta carte come questi:
Ho poi applicato delle lettere ai raccoglitori (A, B, C, …) e dei numeri alle varie pagine (più pagine possono avere lo stesso numero) per avere delle sezioni ordinate in cui riporre le mie carte per poterle catalogare e rintracciare più facilmente.
La web app
Quello che faccio di solito, per tenermi sempre aggiornato, è cercare di inserire delle “cose nuove”, che ancora non so fare, nei progetti, che siano essi lavorativi o hobbystici. Non volendo poi discostarmi più dal paradigma beckend-frontend per la realizzazione di web app, anche per progetti “leggerissimi”, ho dovuto cercare soluzioni davvero semplici e che riducessero al minimo l’effort.
Ho quindi scoperto JSON server, un vero e proprio REST API server pieno di funzionalità, che permette pagination, filtering, sorting e tantissime altre cose, utilzzando… un semplicissimo file JSON invece di un DB!
Davvero super leggero, ben progettatto e molto intelligente, adatto proprio a web app come quella in questione, con un’interfaccia leggera, semplice e originale. Il risultato? Eccolo:
Di seguito, le API relative ad una carta:
[
{
"id": "1",
"set_type": "ST",
"set_id": "ST01",
"card_number": "001",
"quantity": 1,
"card_color": "Red",
"card_type": "Leader",
"rarity": "L",
"foil": "TRUE",
"fruit": "1",
"card_name": "Monkey.D.Luffy (001)",
"inventory_price": 15,
"market_price": 25.92,
"card_image": "https://www.optcgapi.com/media/static/Card_Images/ST01-001.jpg",
"set_name": "Starter Deck 1: Straw Hat Crew",
"card_text": "[Activate: Main] [Once Per Turn] Give this Leader or 1 of your Characters up to 1 rested DON!! card.",
"card_set_id": "ST01-001",
"life": "5",
"card_cost": null,
"card_power": "5000",
"sub_types": "Straw Hat Crew Supernovas",
"counter_amount": null,
"attribute": "Strike",
"date_scraped": "2026-02-27",
"card_image_id": "ST01-001",
"fetched_timestamp": "2026-03-17T19:07:49.543Z",
"card_id": "ST01-001",
"storage": {
"folder": "A",
"page": "1"
},
"starter_deck": "ST01"
},
...E voi, vi direte, ma non bastava un Google Sheet, un Excel, … ?
No. Per più motivi.
Prima di tutto, come accennavo prima, è stata un’occasione per scoprire JSON Server (già questo risponde alla domanda).
Poi, visto che il Mondo è davvero vario, qualcuno ci ha perso anche più tempo di me e ha realizzato delle vere REST API di One Piece Card Game. Sono fatte bene, sufficientemente documentate e, soprattutto, sempre aggiornate per quanto riguarda la quotazione delle carte.
Ed eccoci al punto, la mia web app serve anche, per mero scopo informativo, a darmi un’idea del valore in tempo reale delle carte che possiedo.
Ho quindi realizzato un’altra frontend web app in VUE, che conosco piuttosto bene, e con il mio frontend framework (mini, di cui parlo anche qui) e relativi componenti VUE, ci ho messo davvero poco a ottenere un risultato più che dignitoso.
Il risultato è qualcosa del genere:
Con filtri, paginazione, sorting, … insomma tutto quello che serve, e anche di più.
È una vera e propria interfaccia CRUD, non manca quindi la possibilità di agire sul DB (ovvero il nostro file JSON) anche aggiungendo nuove carte.
Cosa bella? Il bottone “Fetch data” esegue la chiamata API che permette di “fetchare” tutti i dati (thumbnail compresa!) dalle OPCG API citate prima.
Ovviamente, sono presenti i campi che mi permettono di “localizzare” fisicamente la carta all’interno dei contenitori (di seguito: A/1).
Piccolissima precisazione relativa al deploy
Non metto link all’app poichè è privata lo ritengo un progetto privato; se cabierò idea, pubblicherò il link in questo articolo.
Non escludo la possibilità di pubblicare tra le mie repository GitHub i sorgenti del progetto, ma attualmente li ritengo comunque troppo frammentati e complessi per un progetto di queste dimensioni, poichè comprendono backend (JSON server), frontend (VUE + mini) con accesso tramite Auth Server Oauth2 e una discreta dimestichezza nella gestione del server di produzione e relativi DNS.
Se siete interessati, potete sempre contattarmi a ciao@doingthings.space .
A prestooo!
mini