BlackTCG
Marketplace de cartes TCG Pokémon — concurrent Cardmarket avec une meilleure UX et un système de paiement intégré.
- Next.js 16
- TypeScript
- Apollo Server 4
- SCSS
- GSAP
- Express 5
- Prisma 7
- PostgreSQL
- Stripe Connect
- NextAuth v5
Contexte
BlackTCG est une marketplace de cartes Pokémon TCG développée en autonomie complète. L'idée : proposer une alternative à Cardmarket avec une expérience utilisateur supérieure — navigation fluide, catalogue visuel riche et un système de paiement intégré via wallet. Le projet vise à couvrir tout le cycle : dépôt d'annonces, catalogue filtrée, panier, checkout sécurisé et gestion des expéditions.
Architecture
Architecture full-stack découplée : frontend Next.js 16 (App Router, SSR/SSG hybride) + backend Express 5 avec Apollo Server 4 en GraphQL. La base PostgreSQL est gérée via Prisma 7 et hébergée sur Neon (serverless). L'authentification est assurée par NextAuth v5 côté client et JWT côté API GraphQL. Le wallet vendeur est connecté à Stripe Connect via webhooks sécurisés. Les animations visuelles sont orchestrées par GSAP — header, hero, cartes catalogue avec effets 3D.
Fonctionnalités livrées
M1 setup : monorepo Next.js + Express, SCSS design system, stores Zustand. M2 schema : 25 tables PostgreSQL + seed (102 cartes Base Set). M3 auth : JWT backend + NextAuth v5 frontend, guards GraphQL. M4 wallet : wallet service + Stripe Connect + webhook queue worker. M5 catalogue : pages /cartes et /cartes/[slug] — grille 5 colonnes, filtres multi-sélect, tri, vue liste/compact, ActiveFiltersBar, mode mobile complet. Interface premium : header transparent→opaque au scroll, BandeauCreateurs, TrendingSection, HomeHero GSAP.
En cours
M6 marketplace : module order/ (checkout wallet atomique, confirmShipment, confirmReception, cron HOLD J+7), listing CRUD complet, pages /panier · /checkout · /mes-achats · /mes-ventes · /vendre. Prochaine étape : merger M6 → dev, tester le cycle d'achat complet en conditions réelles.