TCG Vault - Trading Card Game Collection Management with OCR Scanning
🎨 Complete Brand Transformation: - Rebranded from 'TCG Vault' to 'Deck Hearth' - Updated logo initials from 'TCG' to 'DH' - Changed app name throughout the application 🔥 Fire-Themed Color Palette: Light Theme (Warm Daylight by the Hearth): - Primary: Warm cream (#fefcf8) like sunlit stone - Secondary: Soft beige (#f7f3ed) like aged parchment - Tertiary: Light wood tone (#f0e6d6) - Text: Dark chocolate brown (#2d1810) - Accents: Ember orange, flame orange, golden yellow Dark Theme (Cozy Evening by the Fire): - Primary: Deep charcoal (#1a0f0a) like burnt wood - Secondary: Rich dark brown (#2d1b12) like oak - Tertiary: Medium brown (#3d2317) like mahogany - Text: Warm white (#fff8f0) like firelight - Accents: Bright flame, glowing ember, golden glow 🎨 Fire-Inspired Design Elements: - Flame gradient: Orange to ember red - Golden gradient: Golden yellow to flame orange - Fire glow effects with warm shadows - Wood-toned borders and accents - Ember and flame-colored interactive elements 🔧 Enhanced Component Styling: - Updated BulkSelectionToolbar with fire colors - New CSS classes: btn-flame, btn-ember, btn-gold - Fire glow and ember glow effects - Gradient backgrounds: gradient-bg-fire, gradient-bg-golden - Tailwind color palette: hearth.flame, hearth.ember, etc. ✨ Warm & Inviting Experience: - Light mode: Cozy daytime fireplace atmosphere - Dark mode: Intimate evening hearth ambiance - Maintains accessibility with proper contrast - Smooth transitions between themes The app now perfectly captures the warm, inviting feeling of gathering around a hearth! 🔥🏠✨ |
||
|---|---|---|
| components | ||
| lib | ||
| pages | ||
| public | ||
| scripts | ||
| styles | ||
| .gitignore | ||
| .npmrc | ||
| bulk-import-results-2025-07-24T15-23-54-843Z.json | ||
| bulk-import-results-2025-07-24T17-20-21-039Z.json | ||
| lorcana-import-results-2025-07-24T17-27-46-410Z.json | ||
| lorcana-import-results-2025-07-24T17-32-10-187Z.json | ||
| lorcana-import-results-2025-07-24T17-34-04-839Z.json | ||
| next-env.d.ts | ||
| next.config.js | ||
| package-lock.json | ||
| package.json | ||
| popular-sets-import-results-2025-07-23T19-35-56-994Z.json | ||
| postcss.config.js | ||
| README.md | ||
| tailwind.config.js | ||
| TESTING_GUIDE.md | ||
| tsconfig.json | ||
| vercel.json | ||
TCG Vault
A modern trading card game collection manager built with Next.js and Neon Database.
🚀 Features
- Card Management: Track your MTG, Pokémon, and Lorcana cards
- Collection Organization: Create and manage card collections
- Deck Building: Build and share decks
- Authentication: Secure user accounts with JWT
- Admin Panel: Manage cards and users
- Real-time Pricing: Track card values
🛠️ Tech Stack
- Frontend: Next.js 15, React 18, TypeScript
- Backend: Next.js API Routes
- Database: Neon PostgreSQL (serverless)
- Authentication: JWT with bcrypt
- Styling: Tailwind CSS
- Deployment: Vercel
📦 Installation
-
Clone the repository
git clone <repository-url> cd tcg-vault -
Install dependencies
npm install -
Set up environment variables
cp .env.example .env.localUpdate
.env.localwith your Neon database URL:POSTGRES_URL="postgresql://your-username:your-password@your-host/your-database" JWT_SECRET="your-super-secret-jwt-key" -
Set up the database
npm run setup-db -
Start development server
npm run dev
🗄️ Database Schema
The application uses the following tables:
users- User accounts and authenticationcards- Card information and metadatauser_cards- User's card collectionscollections- Named card collectionscollection_cards- Cards in collectionsdecks- Deck definitionsdeck_cards- Cards in decks
🔧 API Endpoints
Authentication
POST /api/auth/register- User registrationPOST /api/auth/login- User login
Admin
GET /api/admin- Admin panel data
Health Check
GET /api/health- Application healthGET /api/test-db- Database connection test
🚀 Deployment
This app is configured for deployment on Vercel:
- Connect your repository to Vercel
- Set environment variables in Vercel dashboard
- Deploy automatically on push to main branch
📁 Project Structure
tcg-vault/
├── pages/ # Next.js pages and API routes
│ ├── api/ # API endpoints
│ │ ├── auth/ # Authentication routes
│ │ └── admin/ # Admin routes
│ ├── _app.js # App wrapper
│ └── index.js # Home page
├── lib/ # Utility libraries
│ └── database.js # Database adapter
├── scripts/ # Database setup scripts
├── public/ # Static assets
└── .env.local # Environment variables
🔐 Default Admin Account
After running the database setup:
- Email: admin@tcgvault.com
- Password: admin123
🤝 Contributing
- Fork the repository
- Create a feature branch
- Make your changes
- Submit a pull request
📄 License
MIT License - see LICENSE file for details