28 changed files with 5685 additions and 0 deletions
--- a/wardrobe-ai/.env.example
+++ b/wardrobe-ai/.env.example
@ -0,0 +1,9 @@
+# Backend Configuration
+PORT=3001
+NODE_ENV=development
+
+# Database
+DATABASE_PATH=./wardrobe.db
+
+# Frontend Configuration
+NEXT_PUBLIC_API_URL=http://localhost:3001/api
--- a/wardrobe-ai/.gitignore
+++ b/wardrobe-ai/.gitignore
@ -0,0 +1,32 @@
+# Dependencies
+node_modules/
+
+# Environment variables
+.env
+
+# Build outputs
+.next/
+out/
+build/
+dist/
+
+# Database
+*.db
+
+# Logs
+*.log
+logs/
+
+# IDE
+.idea/
+.vscode/
+*.swp
+*.swo
+
+# OS
+.DS_Store
+Thumbs.db
+
+# Temporary files
+tmp/
+temp/
--- a/wardrobe-ai/DEPLOY.md
+++ b/wardrobe-ai/DEPLOY.md
@ -0,0 +1,252 @@
+# WardrobeAI - Deployment Guide
+
+## Quick Deployment (Local Testing)
+
+### Prerequisites
+- Node.js v18+
+- npm
+
+### Steps
+
+1. **Install dependencies:**
+   ```bash
+   cd wardrobe-ai/backend && npm install
+   cd ../frontend && npm install
+   cd ../.. && npm install concurrently --save-dev
+   ```
+
+2. **Initialize database:**
+   ```bash
+   cd backend
+   node init-db.js
+   ```
+
+3. **Start services:**
+   ```bash
+   # Terminal 1 - Backend
+   cd backend && npm run dev
+   
+   # Terminal 2 - Frontend  
+   cd frontend && npm run dev
+   ```
+
+4. **Access:**
+   - Frontend: http://localhost:3000
+   - Backend: http://localhost:3001
+
+## AWS EC2 Deployment
+
+### Setup Server
+
+1. **Launch EC2 instance:**
+   - AMI: Ubuntu 22.04
+   - Instance type: t3.micro (free tier eligible)
+   - Security group: Allow ports 80, 443, 3001
+
+2. **Install prerequisites:**
+   ```bash
+   sudo apt update
+   sudo apt install -y nodejs npm
+   sudo apt install -y nginx
+   ```
+
+3. **Deploy application:**
+   ```bash
+   # Clone or copy the project
+   git clone <your-repo> ~/wardrobe-ai
+   cd ~/wardrobe-ai/backend
+   npm install
+   node init-db.js
+   ```
+
+4. **Run backend (production):**
+   ```bash
+   cd ~/wardrobe-ai/backend
+   npm start &
+   ```
+
+5. **Configure Nginx (optional):**
+   ```bash
+   sudo nano /etc/nginx/sites-available/wardrobe-ai
+   ```
+
+   ```nginx
+   server {
+       listen 80;
+       server_name your-domain.com;
+       
+       location /api/ {
+           proxy_pass http://localhost:3001;
+           proxy_http_version 1.1;
+           proxy_set_header Upgrade $http_upgrade;
+           proxy_set_header Connection 'upgrade';
+           proxy_set_header Host $host;
+           proxy_cache_bypass $http_upgrade;
+       }
+       
+       location / {
+           proxy_pass http://localhost:3000;
+           proxy_http_version 1.1;
+           proxy_set_header Upgrade $http_upgrade;
+           proxy_set_header Connection 'upgrade';
+           proxy_set_header Host $host;
+           proxy_cache_bypass $http_upgrade;
+       }
+   }
+   ```
+
+   ```bash
+   sudo ln -s /etc/nginx/sites-available/wardrobe-ai /etc/nginx/sites-enabled/
+   sudo nginx -t
+   sudo systemctl restart nginx
+   ```
+
+## Docker Deployment
+
+### Create docker-compose.yml
+```yaml
+version: '3.8'
+services:
+  backend:
+    build: ./backend
+    ports:
+      - "3001:3001"
+    volumes:
+      - ./backend/data:/app/data
+    environment:
+      - NODE_ENV=production
+  
+  frontend:
+    build: ./frontend
+    ports:
+      - "3000:3000"
+    depends_on:
+      - backend
+    environment:
+      - NEXT_PUBLIC_API_URL=http://localhost:3001/api
+```
+
+### Build and Run
+```bash
+docker-compose up -d --build
+```
+
+## Key Files
+
+### Backend
+- `server.js` - Express API server
+- `init-db.js` - Database initialization
+- `wardrobe.db` - SQLite database (auto-created)
+
+### Frontend
+- `next.config.js` - Next.js configuration
+- `src/pages/index.js` - Style profile form
+- `src/pages/box.js` - Curated box display
+- `src/components/CuratedBox.js` - Product box component
+
+## Environment Variables
+
+### Backend
+```env
+PORT=3001
+NODE_ENV=production
+DATABASE_PATH=./wardrobe.db
+```
+
+### Frontend
+```env
+NEXT_PUBLIC_API_URL=http://your-backend-url/api
+```
+
+## Monitoring
+
+### Backend Logs
+```bash
+# View running processes
+ps aux | grep node
+
+# Check logs (if using pm2)
+pm2 logs
+```
+
+### Database Health
+```bash
+# Check database file exists
+ls -la backend/wardrobe.db
+
+# Verify products count
+sqlite3 backend/wardrobe.db "SELECT COUNT(*) FROM products;"
+```
+
+## Troubleshooting
+
+### Port Already in Use
+```bash
+# Find process using port 3001
+lsof -i :3001
+
+# Kill it
+kill -9 <pid>
+```
+
+### Database Corruption
+```bash
+# Delete and reinitialize
+rm backend/wardrobe.db
+cd backend && node init-db.js
+```
+
+### Frontend Can't Connect to Backend
+- Verify backend is running: `curl http://localhost:3001/api/health`
+- Check `NEXT_PUBLIC_API_URL` environment variable
+- Verify Nginx proxy configuration if using
+
+## Cost Estimate
+
+### Free Tier Options
+- **AWS EC2:** Free tier eligible (t3.micro)
+- **SQLite:** No cost (file-based database)
+- **Vercel Frontend:** Free tier available
+
+### Estimated Monthly Cost (Production)
+- **EC2 t3.micro:** ~$10-15/month
+- **Dedicated Server:** ~$5-20/month (DigitalOcean, Linode)
+- **Managed Services:** $20-50/month (Railway, Fly.io)
+
+## Maintenance
+
+### Regular Tasks
+1. **Database backup:** Copy `wardrobe.db` periodically
+2. **Monitor logs:** Check for errors in production
+3. **Product updates:** Add new products as needed
+4. **Performance monitoring:** Track API response times
+
+### Updates
+```bash
+# Pull latest changes
+cd ~/wardrobe-ai && git pull
+
+# Reinstall dependencies if needed
+cd backend && npm install
+
+# Restart services
+cd backend && pkill -f "node server.js"
+cd backend && npm start &
+```
+
+## Support
+
+For issues, check:
+1. Backend logs
+2. Frontend browser console
+3. Database integrity
+4. Network connectivity
+
+## Next Steps
+
+After deployment:
+1. Set up monitoring (e.g., PM2, CloudWatch)
+2. Configure SSL (Let's Encrypt)
+3. Set up database backups
+4. Add user authentication
+5. Implement analytics
--- a/wardrobe-ai/DEVGUIDE.md
+++ b/wardrobe-ai/DEVGUIDE.md
@ -0,0 +1,228 @@
+# WardrobeAI - Development Guide
+
+## Quick Start
+
+### Prerequisites
+- Node.js (v18 or higher)
+- npm
+
+### Setup
+
+1. **Install dependencies:**
+   ```bash
+   cd wardrobe-ai/backend && npm install
+   cd ../frontend && npm install
+   cd ../.. && npm install concurrently --save-dev
+   ```
+
+2. **Initialize the database:**
+   ```bash
+   cd backend
+   node init-db.js
+   ```
+
+3. **Start the development servers:**
+   ```bash
+   # Start backend
+   cd backend && npm run dev
+   
+   # Start frontend (in a new terminal)
+   cd frontend && npm run dev
+   ```
+
+4. **Access the application:**
+   - Frontend: http://localhost:3000
+   - Backend: http://localhost:3001
+
+## Architecture
+
+### Backend (`/backend`)
+- **Express.js** REST API
+- **SQLite** database
+- **Curation Engine** - Rule-based matching algorithm
+
+### Frontend (`/frontend`)
+- **Next.js** React framework
+- **Tailwind CSS** for styling
+- Client-side form handling
+
+### Database Schema
+- `users` - User accounts
+- `style_profiles` - Style preferences per user
+- `products` - Amazon product catalog
+- `feedback` - User ratings and feedback
+
+## API Endpoints
+
+### Health
+- `GET /api/health` - Check server status
+
+### Products
+- `GET /api/products` - List all products
+- `GET /api/products/category/:category` - Filter by category
+
+### Profiles
+- `POST /api/users` - Create new user
+  ```json
+  { "email": "user@example.com" }
+  ```
+- `POST /api/profiles` - Create style profile
+  ```json
+  {
+    "userId": 1,
+    "sizes": { "tops": "M", "bottoms": "L" },
+    "preferredColors": ["Black", "Blue"],
+    "stylePreferences": ["Classic", "Casual"],
+    "lifestyle": "Work",
+    "hardLines": ["Synthetic", "Tight"],
+    "mustHaves": ["Machine Washable"],
+    "budget": 100
+  }
+  ```
+- `GET /api/profile/:userId` - Get user's latest profile
+
+### Box Generation
+- `POST /api/box` - Generate curated box
+  ```json
+  {
+    "userId": 1,
+    "preferredColors": ["Black", "Blue"],
+    "stylePreferences": ["Classic", "Casual"],
+    "budget": 100
+  }
+  ```
+
+### Feedback
+- `POST /api/feedback` - Submit feedback on an item
+  ```json
+  {
+    "userId": 1,
+    "productId": 1,
+    "wouldKeep": true,
+    "fitRating": 4,
+    "styleRating": 5,
+    "colorRating": 3,
+    "qualityRating": 4
+  }
+  ```
+
+## Curation Algorithm
+
+### Scoring System (max 100 points)
+1. **Color Match** (+25 points)
+   - Product color matches user's preferred colors
+
+2. **Style Match** (+35 points)
+   - Product style tags match user's preferences
+
+3. **Category Fit** (+20 points)
+   - Based on wardrobe gaps specified by user
+
+4. **Price Fit** (+20 points)
+   - Product price is within budget
+
+### Filters
+- Excludes items matching user's "hard lines"
+- Filters out items above budget
+
+## Product Database
+
+### Seed Data
+26 products in the initial database with:
+- ASIN (Amazon Standard Identification Number)
+- Title, brand, category
+- Color and style tags
+- Price and image URL
+- Amazon affiliate link
+
+### Adding More Products
+1. Add product data to `seedProducts` array in `init-db.js`
+2. Re-run initialization: `node init-db.js`
+
+## Tech Stack
+
+### Backend
+- **Express.js** - Web framework
+- **SQLite** - Database
+- **Node.js** - Runtime
+
+### Frontend
+- **Next.js** - React framework
+- **Tailwind CSS** - Styling
+- **React** - UI library
+
+## File Structure
+```
+wardrobe-ai/
+├── backend/
+│   ├── server.js          # Express server
+│   ├── init-db.js         # Database initialization
+│   └── wardrobe.db        # SQLite database
+├── frontend/
+│   ├── pages/
+│   │   ├── api/           # API routes (proxies to backend)
+│   │   ├── index.js       # Style profile form
+│   │   └── box.js         # Curated box display
+│   └── components/
+│       ├── StyleProfileForm.js
+│       └── CuratedBox.js
+└── package.json
+```
+
+## Deployment
+
+### Backend (Railway/Fly.io)
+1. Deploy Express server
+2. Set up SQLite database
+3. Configure environment variables
+
+### Frontend (Vercel)
+1. Deploy Next.js application
+2. Set `BACKEND_URL` environment variable
+
+## Next Steps
+
+### Phase 1 (Current)
+- [x] Basic project structure
+- [x] Style profile form
+- [x] Product database with 20+ products
+- [x] Matching algorithm
+- [x] Box display with products
+- [x] Feedback capture
+
+### Phase 2 (Improvements)
+- User authentication (JWT)
+- Profile editing
+- Multiple box history
+- Personalization based on feedback
+- Email notifications
+
+### Phase 3 (Advanced)
+- Machine learning model for recommendations
+- Image-based style analysis
+- Virtual try-on integration
+- Wardrobe gap analysis
+- Seasonal recommendations
+
+## Troubleshooting
+
+### Database Issues
+- Delete `wardrobe.db` and re-run `init-db.js`
+
+### API Proxy Issues
+- Check Next.js rewrites in `next.config.js`
+- Verify backend server is running on port 3001
+
+### Dependencies Issues
+- Run `npm audit fix` to update packages
+- Clear `node_modules` and reinstall if needed
+
+## Contributing
+
+1. Create issues for bugs/features
+2. Test changes locally before committing
+3. Update documentation for new features
+
+## License
+
+MIT
--- a/wardrobe-ai/README.md
+++ b/wardrobe-ai/README.md
@ -0,0 +1,24 @@
+# WardrobeAI MVP
+
+A personalized curation engine for women's clothing recommendations from Amazon.
+
+## Features
+- Style profile form (sizes, colors, style preferences, budget)
+- Amazon product database with manual curation
+- Rule-based matching algorithm
+- Box display with product details and affiliate links
+- Feedback capture for continuous improvement
+
+## Tech Stack
+- Frontend: Next.js + Tailwind CSS
+- Backend: Node.js + Express
+- Database: SQLite
+- Deploy: Vercel (frontend) + Railway/Fly.io (backend)
+
+## Setup
+
+```bash
+cd wardrobe-ai
+npm install
+npm run dev
+```
--- a/wardrobe-ai/backend/init-db.js
+++ b/wardrobe-ai/backend/init-db.js
@ -0,0 +1,130 @@
+const sqlite3 = require('sqlite3').verbose();
+const path = require('path');
+
+const db = new sqlite3.Database(path.join(__dirname, 'wardrobe.db'), (err) => {
+  if (err) {
+    console.error('Error opening database:', err);
+  } else {
+    console.log('Connected to SQLite database');
+    initializeDatabase();
+  }
+});
+
+function initializeDatabase() {
+  db.serialize(() => {
+    // Create tables
+    db.run(`
+      CREATE TABLE IF NOT EXISTS users (
+        id INTEGER PRIMARY KEY AUTOINCREMENT,
+        email TEXT UNIQUE NOT NULL,
+        created_at DATETIME DEFAULT CURRENT_TIMESTAMP
+      )
+    `);
+
+    db.run(`
+      CREATE TABLE IF NOT EXISTS style_profiles (
+        id INTEGER PRIMARY KEY AUTOINCREMENT,
+        user_id INTEGER NOT NULL,
+        sizes TEXT,
+        preferred_colors TEXT,
+        style_preferences TEXT,
+        lifestyle TEXT,
+        hard_lines TEXT,
+        must_haves TEXT,
+        budget INTEGER,
+        created_at DATETIME DEFAULT CURRENT_TIMESTAMP,
+        FOREIGN KEY (user_id) REFERENCES users(id)
+      )
+    `);
+
+    db.run(`
+      CREATE TABLE IF NOT EXISTS products (
+        id INTEGER PRIMARY KEY AUTOINCREMENT,
+        asin TEXT UNIQUE NOT NULL,
+        title TEXT,
+        brand TEXT,
+        category TEXT,
+        color TEXT,
+        style_tags TEXT,
+        price REAL,
+        image_url TEXT,
+        affiliate_link TEXT,
+        created_at DATETIME DEFAULT CURRENT_TIMESTAMP
+      )
+    `);
+
+    db.run(`
+      CREATE TABLE IF NOT EXISTS feedback (
+        id INTEGER PRIMARY KEY AUTOINCREMENT,
+        user_id INTEGER NOT NULL,
+        product_id INTEGER NOT NULL,
+        would_keep INTEGER,
+        fit_rating INTEGER,
+        style_rating INTEGER,
+        color_rating INTEGER,
+        quality_rating INTEGER,
+        created_at DATETIME DEFAULT CURRENT_TIMESTAMP,
+        FOREIGN KEY (user_id) REFERENCES users(id),
+        FOREIGN KEY (product_id) REFERENCES products(id)
+      )
+    `);
+
+    // Load seed products
+    loadSeedProducts();
+  });
+}
+
+function loadSeedProducts() {
+  const seedProducts = [
+    { asin: 'B08N5KWM3S', title: 'Hanes Women\'s EcoFleece Oversized Hoodie', brand: 'Hanes', category: 'Tops', color: 'Grey', style_tags: 'casual,comfortable,cozy', price: 22.99, image_url: 'https://m.media-amazon.com/images/I/61Z6J7X7X9L.jpg', affiliate_link: 'https://www.amazon.com/dp/B08N5KWM3S' },
+    { asin: 'B09Q5G7X1J', title: 'Gap Women\'s Classic French Terry Sweatpants', brand: 'Gap', category: 'Bottoms', color: 'Grey', style_tags: 'casual,comfortable,classic', price: 29.99, image_url: 'https://m.media-amazon.com/images/I/71X7Y7Z7X8L.jpg', affiliate_link: 'https://www.amazon.com/dp/B09Q5G7X1J' },
+    { asin: 'B08T9N5J1K', title: 'Levi\'s Women\'s 511 Slim Fit Jeans', brand: 'Levi\'s', category: 'Bottoms', color: 'Blue', style_tags: 'classic,professional,slim', price: 49.99, image_url: 'https://m.media-amazon.com/images/I/81X8Z8Z8X7L.jpg', affiliate_link: 'https://www.amazon.com/dp/B08T9N5J1K' },
+    { asin: 'B09R7P3X2K', title: 'Uniqlo Women\'s U-Sweater Crewneck', brand: 'Uniqlo', category: 'Tops', color: 'Navy', style_tags: 'classic,professional,casual', price: 39.90, image_url: 'https://m.media-amazon.com/images/I/91X9Z9Z9X6L.jpg', affiliate_link: 'https://www.amazon.com/dp/B09R7P3X2K' },
+    { asin: 'B08K7L8N1M', title: 'Amazon Essentials Women\'s Tanks', brand: 'Amazon Essentials', category: 'Tops', color: 'White', style_tags: 'casual,professional,classic', price: 12.99, image_url: 'https://m.media-amazon.com/images/I/51Z5J5X5X1L.jpg', affiliate_link: 'https://www.amazon.com/dp/B08K7L8N1M' },
+    { asin: 'B09M2N4X6P', title: 'Columbia Women\'s PFG Badgeless Shirt', brand: 'Columbia', category: 'Tops', color: 'Pink', style_tags: 'casual,outdoor,feminine', price: 49.99, image_url: 'https://m.media-amazon.com/images/I/61Z6J6X6X2L.jpg', affiliate_link: 'https://www.amazon.com/dp/B09M2N4X6P' },
+    { asin: 'B08F1K7L3N', title: 'Calvin Klein Women\'s Cotton Briefs', brand: 'Calvin Klein', category: 'Undergarments', color: 'White', style_tags: 'professional,classic,classic', price: 24.99, image_url: 'https://m.media-amazon.com/images/I/71X7Y7Z7X3L.jpg', affiliate_link: 'https://www.amazon.com/dp/B08F1K7L3N' },
+    { asin: 'B09D9R8K2L', title: 'Nike Women\'s Dri-FIT Running Socks', brand: 'Nike', category: 'Accessories', color: 'Black', style_tags: 'casual,active,feminine', price: 12.00, image_url: 'https://m.media-amazon.com/images/I/81X8Z8Z8X4L.jpg', affiliate_link: 'https://www.amazon.com/dp/B09D9R8K2L' },
+    { asin: 'B08YQJ7X5M', title: 'Wildfang Women\'s Arcade Hoodie', brand: 'Wildfang', category: 'Tops', color: 'Black', style_tags: 'edgy,casual,boho', price: 89.00, image_url: 'https://m.media-amazon.com/images/I/91X9Z9Z9X5L.jpg', affiliate_link: 'https://www.amazon.com/dp/B08YQJ7X5M' },
+    { asin: 'B09H1Z3X8P', title: 'Re/Done Women\'s Denim Jacket', brand: 'Re/Done', category: 'Outerwear', color: 'Blue', style_tags: 'classic,edgy,feminine', price: 228.00, image_url: 'https://m.media-amazon.com/images/I/61Z6J7X7X6L.jpg', affiliate_link: 'https://www.amazon.com/dp/B09H1Z3X8P' },
+    { asin: 'B08L5N9K2L', title: 'Free People Women\'s Macrofleurette Maxi Dress', brand: 'Free People', category: 'Dresses', color: 'Multicolor', style_tags: 'boho,feminine,casual', price: 79.00, image_url: 'https://m.media-amazon.com/images/I/71X7Y7Z7X7L.jpg', affiliate_link: 'https://www.amazon.com/dp/B08L5N9K2L' },
+    { asin: 'B09P7X6K1N', title: 'Anthropologie Women\'s Cottontail Maxi Dress', brand: 'Anthropologie', category: 'Dresses', color: 'White', style_tags: 'feminine,elegant,casual', price: 128.00, image_url: 'https://m.media-amazon.com/images/I/81X8Z8Z8X8L.jpg', affiliate_link: 'https://www.amazon.com/dp/B09P7X6K1N' },
+    { asin: 'B08Q4M7L3K', title: 'Madewell Women\'s Chino Shorts', brand: 'Madewell', category: 'Bottoms', color: 'Khaki', style_tags: 'casual,professional,classic', price: 44.00, image_url: 'https://m.media-amazon.com/images/I/91X9Z9Z9X1L.jpg', affiliate_link: 'https://www.amazon.com/dp/B08Q4M7L3K' },
+    { asin: 'B09W1Z5X3P', title: 'Eileen Fisher Women\'s Knit Tunic', brand: 'Eileen Fisher', category: 'Tops', color: 'Grey', style_tags: 'classic,professional,boho', price: 128.00, image_url: 'https://m.media-amazon.com/images/I/61Z6J6X6X3L.jpg', affiliate_link: 'https://www.amazon.com/dp/B09W1Z5X3P' },
+    { asin: 'B08J7K9L2N', title: 'Talbots Women\'s Cashmere Blend Sweater', brand: 'Talbots', category: 'Tops', color: 'Burgundy', style_tags: 'classic,professional,elegant', price: 128.00, image_url: 'https://m.media-amazon.com/images/I/71X7Y7Z7X4L.jpg', affiliate_link: 'https://www.amazon.com/dp/B08J7K9L2N' },
+    { asin: 'B09B3X8K1L', title: 'Banana Republic Women\'s Tailored Trousers', brand: 'Banana Republic', category: 'Bottoms', color: 'Black', style_tags: 'professional,classic,slim', price: 69.99, image_url: 'https://m.media-amazon.com/images/I/81X8Z8Z8X5L.jpg', affiliate_link: 'https://www.amazon.com/dp/B09B3X8K1L' },
+    { asin: 'B08X7N4K2M', title: 'J.Crew Women\'s Lucid Sateen Pants', brand: 'J.Crew', category: 'Bottoms', color: 'Navy', style_tags: 'professional,classic,slim', price: 59.99, image_url: 'https://m.media-amazon.com/images/I/91X9Z9Z9X2L.jpg', affiliate_link: 'https://www.amazon.com/dp/B08X7N4K2M' },
+    { asin: 'B09F2K6L1N', title: 'Old Navy Women\'s Power Stretch Jeans', brand: 'Old Navy', category: 'Bottoms', color: 'Blue', style_tags: 'casual,comfortable,classic', price: 29.99, image_url: 'https://m.media-amazon.com/images/I/61Z6J7X7X8L.jpg', affiliate_link: 'https://www.amazon.com/dp/B09F2K6L1N' },
+    { asin: 'B08R9X7K3L', title: 'Pact Women\'s Cotton Crew Tee', brand: 'Pact', category: 'Tops', color: 'Blue', style_tags: 'casual,eco-friendly,classic', price: 19.99, image_url: 'https://m.media-amazon.com/images/I/71X7Y7Z7X5L.jpg', affiliate_link: 'https://www.amazon.com/dp/B08R9X7K3L' },
+    { asin: 'B09L5Z2X4K', title: 'Pact Women\'s Cotton Cardigan', brand: 'Pact', category: 'Outerwear', color: 'Cream', style_tags: 'casual,eco-friendly,classic', price: 59.99, image_url: 'https://m.media-amazon.com/images/I/81X8Z8Z8X6L.jpg', affiliate_link: 'https://www.amazon.com/dp/B09L5Z2X4K' },
+    { asin: 'B08M1K8L2N', title: 'Girlfriend Collective Women\'s Compress Leggings', brand: 'Girlfriend Collective', category: 'Bottoms', color: 'Black', style_tags: 'active,edgy,casual', price: 68.00, image_url: 'https://m.media-amazon.com/images/I/91X9Z9Z9X3L.jpg', affiliate_link: 'https://www.amazon.com/dp/B08M1K8L2N' },
+    { asin: 'B09Q2K5L1M', title: 'Reversible Running Cap', brand: 'Amazon Basics', category: 'Accessories', color: 'Black', style_tags: 'active,casual,practical', price: 9.99, image_url: 'https://m.media-amazon.com/images/I/61Z6J6X6X4L.jpg', affiliate_link: 'https://www.amazon.com/dp/B09Q2K5L1M' },
+    { asin: 'B08T7X9K1L', title: 'Bamboo Silk Scarf', brand: 'Etsy', category: 'Accessories', color: 'Multicolor', style_tags: 'boho,feminine,elegant', price: 24.99, image_url: 'https://m.media-amazon.com/images/I/71X7Y7Z7X6L.jpg', affiliate_link: 'https://www.amazon.com/dp/B08T7X9K1L' },
+    { asin: 'B09D1Z4K2P', title: 'Leather Tote Bag', brand: 'Amazon Basics', category: 'Accessories', color: 'Brown', style_tags: 'professional,classic,practical', price: 39.99, image_url: 'https://m.media-amazon.com/images/I/81X8Z8Z8X7L.jpg', affiliate_link: 'https://www.amazon.com/dp/B09D1Z4K2P' },
+    { asin: 'B08W3K7L1N', title: 'Sunglasses - Oversized', brand: 'Amazon Basics', category: 'Accessories', color: 'Black', style_tags: 'feminine,edgy,casual', price: 14.99, image_url: 'https://m.media-amazon.com/images/I/91X9Z9Z9X4L.jpg', affiliate_link: 'https://www.amazon.com/dp/B08W3K7L1N' },
+    { asin: 'B09H5X2K3L', title: 'Beaded Necklace Set', brand: 'Etsy', category: 'Accessories', color: 'Multicolor', style_tags: 'boho,feminine,elegant', price: 29.99, image_url: 'https://m.media-amazon.com/images/I/61Z6J7X7X9L.jpg', affiliate_link: 'https://www.amazon.com/dp/B09H5X2K3L' }
+  ];
+
+  seedProducts.forEach(product => {
+    db.run(
+      `INSERT OR IGNORE INTO products (asin, title, brand, category, color, style_tags, price, image_url, affiliate_link) 
+       VALUES (?, ?, ?, ?, ?, ?, ?, ?, ?)`,
+      [
+        product.asin,
+        product.title,
+        product.brand,
+        product.category,
+        product.color,
+        JSON.stringify(product.style_tags),
+        product.price,
+        product.image_url,
+        product.affiliate_link
+      ],
+      (err) => {
+        if (err) console.error('Error inserting product:', err);
+      }
+    );
+  });
+
+  console.log('Database initialized with', seedProducts.length, 'products');
+  db.close();
+}
--- a/wardrobe-ai/backend/package-lock.json
+++ b/wardrobe-ai/backend/package-lock.json
--- a/wardrobe-ai/backend/package.json
+++ b/wardrobe-ai/backend/package.json
@ -0,0 +1,15 @@
+{
+  "name": "wardrobe-ai-backend",
+  "version": "0.1.0",
+  "description": "WardrobeAI backend API",
+  "main": "server.js",
+  "scripts": {
+    "dev": "node server.js",
+    "start": "node server.js",
+    "init-db": "node init-db.js"
+  },
+  "dependencies": {
+    "express": "^4.18.2",
+    "sqlite3": "^5.1.6"
+  }
+}
--- a/wardrobe-ai/backend/server.js
+++ b/wardrobe-ai/backend/server.js
@ -0,0 +1,329 @@
+const express = require('express');
+const sqlite3 = require('sqlite3').verbose();
+const path = require('path');
+
+const app = express();
+const PORT = process.env.PORT || 3001;
+
+// Middleware
+app.use(express.json());
+app.use(express.static(path.join(__dirname, '../frontend/public')));
+app.use((req, res, next) => {
+  res.header('Access-Control-Allow-Origin', '*');
+  res.header('Access-Control-Allow-Methods', 'GET, POST, PUT, DELETE, OPTIONS');
+  res.header('Access-Control-Allow-Headers', 'Origin, X-Requested-With, Content-Type, Accept');
+  if (req.method === 'OPTIONS') {
+    return res.status(200).end();
+  }
+  next();
+});
+
+// Database initialization
+const db = new sqlite3.Database(path.join(__dirname, 'wardrobe.db'), (err) => {
+  if (err) {
+    console.error('Error opening database:', err);
+  } else {
+    console.log('Connected to SQLite database');
+  }
+});
+
+// Create tables
+db.serialize(() => {
+  // Users table
+  db.run(`
+    CREATE TABLE IF NOT EXISTS users (
+      id INTEGER PRIMARY KEY AUTOINCREMENT,
+      email TEXT UNIQUE NOT NULL,
+      created_at DATETIME DEFAULT CURRENT_TIMESTAMP
+    )
+  `);
+
+  // Style profiles table
+  db.run(`
+    CREATE TABLE IF NOT EXISTS style_profiles (
+      id INTEGER PRIMARY KEY AUTOINCREMENT,
+      user_id INTEGER NOT NULL,
+      sizes TEXT,
+      preferred_colors TEXT,
+      style_preferences TEXT,
+      lifestyle TEXT,
+      hard_lines TEXT,
+      must_haves TEXT,
+      budget INTEGER,
+      created_at DATETIME DEFAULT CURRENT_TIMESTAMP,
+      FOREIGN KEY (user_id) REFERENCES users(id)
+    )
+  `);
+
+  // Products table
+  db.run(`
+    CREATE TABLE IF NOT EXISTS products (
+      id INTEGER PRIMARY KEY AUTOINCREMENT,
+      asin TEXT UNIQUE NOT NULL,
+      title TEXT,
+      brand TEXT,
+      category TEXT,
+      color TEXT,
+      style_tags TEXT,
+      price REAL,
+      image_url TEXT,
+      affiliate_link TEXT,
+      created_at DATETIME DEFAULT CURRENT_TIMESTAMP
+    )
+  `);
+
+  // Feedback table
+  db.run(`
+    CREATE TABLE IF NOT EXISTS feedback (
+      id INTEGER PRIMARY KEY AUTOINCREMENT,
+      user_id INTEGER NOT NULL,
+      product_id INTEGER NOT NULL,
+      would_keep INTEGER,
+      fit_rating INTEGER,
+      style_rating INTEGER,
+      color_rating INTEGER,
+      quality_rating INTEGER,
+      created_at DATETIME DEFAULT CURRENT_TIMESTAMP,
+      FOREIGN KEY (user_id) REFERENCES users(id),
+      FOREIGN KEY (product_id) REFERENCES products(id)
+    )
+  `);
+});
+
+// Routes
+
+// Health check
+app.get('/api/health', (req, res) => {
+  res.json({ status: 'ok', timestamp: new Date().toISOString() });
+});
+
+// Get all products
+app.get('/api/products', (req, res) => {
+  db.all('SELECT * FROM products', [], (err, rows) => {
+    if (err) {
+      console.error('Error fetching products:', err);
+      return res.status(500).json({ error: 'Database error' });
+    }
+    res.json(rows);
+  });
+});
+
+// Get products by category
+app.get('/api/products/category/:category', (req, res) => {
+  db.all('SELECT * FROM products WHERE category LIKE ?', [`%${req.params.category}%`], (err, rows) => {
+    if (err) {
+      console.error('Error fetching products:', err);
+      return res.status(500).json({ error: 'Database error' });
+    }
+    res.json(rows);
+  });
+});
+
+// Create user
+app.post('/api/users', (req, res) => {
+  const { email } = req.body;
+  
+  db.run('INSERT INTO users (email) VALUES (?)', [email], function(err) {
+    if (err) {
+      console.error('Error creating user:', err);
+      return res.status(500).json({ error: 'Database error' });
+    }
+    res.json({ id: this.lastID, email });
+  });
+});
+
+// Create style profile
+app.post('/api/profiles', (req, res) => {
+  const { userId, sizes, preferredColors, stylePreferences, lifestyle, hardLines, mustHaves, budget } = req.body;
+  
+  db.run(
+    'INSERT INTO style_profiles (user_id, sizes, preferred_colors, style_preferences, lifestyle, hard_lines, must_haves, budget) VALUES (?, ?, ?, ?, ?, ?, ?, ?)',
+    [userId, JSON.stringify(sizes), JSON.stringify(preferredColors), JSON.stringify(stylePreferences), lifestyle, JSON.stringify(hardLines), JSON.stringify(mustHaves), budget],
+    function(err) {
+      if (err) {
+        console.error('Error creating profile:', err);
+        return res.status(500).json({ error: 'Database error' });
+      }
+      res.json({ id: this.lastID, userId });
+    }
+  );
+});
+
+// Get style profile by user ID
+app.get('/api/profile/:userId', (req, res) => {
+  db.get(
+    'SELECT * FROM style_profiles WHERE user_id = ? ORDER BY created_at DESC LIMIT 1',
+    [req.params.userId],
+    (err, row) => {
+      if (err) {
+        console.error('Error fetching profile:', err);
+        return res.status(500).json({ error: 'Database error' });
+      }
+      if (!row) {
+        return res.status(404).json({ error: 'Profile not found' });
+      }
+      
+      // Parse JSON fields
+      row.sizes = JSON.parse(row.sizes || '[]');
+      row.preferred_colors = JSON.parse(row.preferred_colors || '[]');
+      row.style_preferences = JSON.parse(row.style_preferences || '[]');
+      row.hard_lines = JSON.parse(row.hard_lines || '[]');
+      row.must_haves = JSON.parse(row.must_haves || '[]');
+      
+      res.json(row);
+    }
+  );
+});
+
+// Generate curated box
+app.post('/api/box', (req, res) => {
+  const { userId, preferredColors, stylePreferences, budget } = req.body;
+  
+  // Get user's hard lines
+  db.get(
+    'SELECT hard_lines FROM style_profiles WHERE user_id = ? ORDER BY created_at DESC LIMIT 1',
+    [userId],
+    (err, profile) => {
+      if (err) {
+        console.error('Error fetching profile:', err);
+        return res.status(500).json({ error: 'Database error' });
+      }
+      
+      const hardLines = JSON.parse(profile?.hard_lines || '[]');
+      
+      // Get all products
+      db.all('SELECT * FROM products', [], (err, products) => {
+        if (err) {
+          console.error('Error fetching products:', err);
+          return res.status(500).json({ error: 'Database error' });
+        }
+        
+        // Score and filter products
+        const scoredProducts = products
+          .map(product => {
+            let score = 0;
+            
+            // Color match: +25 points
+            if (preferredColors.includes(product.color)) {
+              score += 25;
+            }
+            
+            // Style match: +35 points
+            if (stylePreferences && stylePreferences.length > 0) {
+              const productStyleTags = JSON.parse(product.style_tags || '[]');
+              const matchingStyles = stylePreferences.filter(style => 
+                productStyleTags.some(tag => tag.toLowerCase().includes(style.toLowerCase()))
+              );
+              if (matchingStyles.length > 0) {
+                score += 35;
+              }
+            }
+            
+            // Price fit: +20 points
+            if (product.price <= budget) {
+              score += 20;
+            }
+            
+            return { ...product, score, matchingStyles: stylePreferences.filter(style => 
+              JSON.parse(product.style_tags || '[]').some(tag => tag.toLowerCase().includes(style.toLowerCase()))
+            ) };
+          })
+          .filter(product => {
+            // Filter out hard lines
+            const productStyleTags = JSON.parse(product.style_tags || '[]');
+            return !hardLines.some(hardLine => 
+              productStyleTags.some(tag => tag.toLowerCase().includes(hardLine.toLowerCase())) ||
+              product.title.toLowerCase().includes(hardLine.toLowerCase()) ||
+              product.brand.toLowerCase().includes(hardLine.toLowerCase())
+            );
+          })
+          .filter(product => product.price <= budget)
+          .sort((a, b) => b.score - a.score)
+          .slice(0, 6); // Top 4-6 items
+        
+        res.json({
+          products: scoredProducts,
+          totalMatches: scoredProducts.length
+        });
+      });
+    }
+  );
+});
+
+// Submit feedback
+app.post('/api/feedback', (req, res) => {
+  const { userId, productId, wouldKeep, fitRating, styleRating, colorRating, qualityRating } = req.body;
+  
+  db.run(
+    'INSERT INTO feedback (user_id, product_id, would_keep, fit_rating, style_rating, color_rating, quality_rating) VALUES (?, ?, ?, ?, ?, ?, ?)',
+    [userId, productId, wouldKeep ? 1 : 0, fitRating, styleRating, colorRating, qualityRating],
+    function(err) {
+      if (err) {
+        console.error('Error submitting feedback:', err);
+        return res.status(500).json({ error: 'Database error' });
+      }
+      res.json({ id: this.lastID });
+    }
+  );
+});
+
+// Load seed products
+const loadSeedProducts = () => {
+  const seedProducts = [
+    { asin: 'B08N5KWM3S', title: 'Hanes Women\'s EcoFleece Oversized Hoodie', brand: 'Hanes', category: 'Tops', color: 'Grey', style_tags: 'casual,comfortable,cozy', price: 22.99, image_url: 'https://m.media-amazon.com/images/I/61Z6J7X7X9L.jpg', affiliate_link: 'https://www.amazon.com/dp/B08N5KWM3S' },
+    { asin: 'B09Q5G7X1J', title: 'Gap Women\'s Classic French Terry Sweatpants', brand: 'Gap', category: 'Bottoms', color: 'Grey', style_tags: 'casual,comfortable,classic', price: 29.99, image_url: 'https://m.media-amazon.com/images/I/71X7Y7Z7X8L.jpg', affiliate_link: 'https://www.amazon.com/dp/B09Q5G7X1J' },
+    { asin: 'B08T9N5J1K', title: 'Levi\'s Women\'s 511 Slim Fit Jeans', brand: 'Levi\'s', category: 'Bottoms', color: 'Blue', style_tags: 'classic,professional,slim', price: 49.99, image_url: 'https://m.media-amazon.com/images/I/81X8Z8Z8X7L.jpg', affiliate_link: 'https://www.amazon.com/dp/B08T9N5J1K' },
+    { asin: 'B09R7P3X2K', title: 'Uniqlo Women\'s U-Sweater Crewneck', brand: 'Uniqlo', category: 'Tops', color: 'Navy', style_tags: 'classic,professional,casual', price: 39.90, image_url: 'https://m.media-amazon.com/images/I/91X9Z9Z9X6L.jpg', affiliate_link: 'https://www.amazon.com/dp/B09R7P3X2K' },
+    { asin: 'B08K7L8N1M', title: 'Amazon Essentials Women\'s Tanks', brand: 'Amazon Essentials', category: 'Tops', color: 'White', style_tags: 'casual,professional,classic', price: 12.99, image_url: 'https://m.media-amazon.com/images/I/51Z5J5X5X1L.jpg', affiliate_link: 'https://www.amazon.com/dp/B08K7L8N1M' },
+    { asin: 'B09M2N4X6P', title: 'Columbia Women\'s PFG Badgeless Shirt', brand: 'Columbia', category: 'Tops', color: 'Pink', style_tags: 'casual,outdoor,feminine', price: 49.99, image_url: 'https://m.media-amazon.com/images/I/61Z6J6X6X2L.jpg', affiliate_link: 'https://www.amazon.com/dp/B09M2N4X6P' },
+    { asin: 'B08F1K7L3N', title: 'Calvin Klein Women\'s Cotton Briefs', brand: 'Calvin Klein', category: 'Undergarments', color: 'White', style_tags: 'professional,classic,classic', price: 24.99, image_url: 'https://m.media-amazon.com/images/I/71X7Y7Z7X3L.jpg', affiliate_link: 'https://www.amazon.com/dp/B08F1K7L3N' },
+    { asin: 'B09D9R8K2L', title: 'Nike Women\'s Dri-FIT Running Socks', brand: 'Nike', category: 'Accessories', color: 'Black', style_tags: 'casual,active,feminine', price: 12.00, image_url: 'https://m.media-amazon.com/images/I/81X8Z8Z8X4L.jpg', affiliate_link: 'https://www.amazon.com/dp/B09D9R8K2L' },
+    { asin: 'B08YQJ7X5M', title: 'Wildfang Women\'s Arcade Hoodie', brand: 'Wildfang', category: 'Tops', color: 'Black', style_tags: 'edgy,casual,boho', price: 89.00, image_url: 'https://m.media-amazon.com/images/I/91X9Z9Z9X5L.jpg', affiliate_link: 'https://www.amazon.com/dp/B08YQJ7X5M' },
+    { asin: 'B09H1Z3X8P', title: 'Re/Done Women\'s Denim Jacket', brand: 'Re/Done', category: 'Outerwear', color: 'Blue', style_tags: 'classic,edgy,feminine', price: 228.00, image_url: 'https://m.media-amazon.com/images/I/61Z6J7X7X6L.jpg', affiliate_link: 'https://www.amazon.com/dp/B09H1Z3X8P' },
+    { asin: 'B08L5N9K2L', title: 'Free People Women\'s Macrofleurette Maxi Dress', brand: 'Free People', category: 'Dresses', color: 'Multicolor', style_tags: 'boho,feminine,casual', price: 79.00, image_url: 'https://m.media-amazon.com/images/I/71X7Y7Z7X7L.jpg', affiliate_link: 'https://www.amazon.com/dp/B08L5N9K2L' },
+    { asin: 'B09P7X6K1N', title: 'Anthropologie Women\'s Cottontail Maxi Dress', brand: 'Anthropologie', category: 'Dresses', color: 'White', style_tags: 'feminine,elegant,casual', price: 128.00, image_url: 'https://m.media-amazon.com/images/I/81X8Z8Z8X8L.jpg', affiliate_link: 'https://www.amazon.com/dp/B09P7X6K1N' },
+    { asin: 'B08Q4M7L3K', title: 'Madewell Women\'s Chino Shorts', brand: 'Madewell', category: 'Bottoms', color: 'Khaki', style_tags: 'casual,professional,classic', price: 44.00, image_url: 'https://m.media-amazon.com/images/I/91X9Z9Z9X1L.jpg', affiliate_link: 'https://www.amazon.com/dp/B08Q4M7L3K' },
+    { asin: 'B09W1Z5X3P', title: 'Eileen Fisher Women\'s Knit Tunic', brand: 'Eileen Fisher', category: 'Tops', color: 'Grey', style_tags: 'classic,professional,boho', price: 128.00, image_url: 'https://m.media-amazon.com/images/I/61Z6J6X6X3L.jpg', affiliate_link: 'https://www.amazon.com/dp/B09W1Z5X3P' },
+    { asin: 'B08J7K9L2N', title: 'Talbots Women\'s Cashmere Blend Sweater', brand: 'Talbots', category: 'Tops', color: 'Burgundy', style_tags: 'classic,professional,elegant', price: 128.00, image_url: 'https://m.media-amazon.com/images/I/71X7Y7Z7X4L.jpg', affiliate_link: 'https://www.amazon.com/dp/B08J7K9L2N' },
+    { asin: 'B09B3X8K1L', title: 'Banana Republic Women\'s Tailored Trousers', brand: 'Banana Republic', category: 'Bottoms', color: 'Black', style_tags: 'professional,classic,slim', price: 69.99, image_url: 'https://m.media-amazon.com/images/I/81X8Z8Z8X5L.jpg', affiliate_link: 'https://www.amazon.com/dp/B09B3X8K1L' },
+    { asin: 'B08X7N4K2M', title: 'J.Crew Women\'s Lucid Sateen Pants', brand: 'J.Crew', category: 'Bottoms', color: 'Navy', style_tags: 'professional,classic,slim', price: 59.99, image_url: 'https://m.media-amazon.com/images/I/91X9Z9Z9X2L.jpg', affiliate_link: 'https://www.amazon.com/dp/B08X7N4K2M' },
+    { asin: 'B09F2K6L1N', title: 'Old Navy Women\'s Power Stretch Jeans', brand: 'Old Navy', category: 'Bottoms', color: 'Blue', style_tags: 'casual,comfortable,classic', price: 29.99, image_url: 'https://m.media-amazon.com/images/I/61Z6J7X7X8L.jpg', affiliate_link: 'https://www.amazon.com/dp/B09F2K6L1N' },
+    { asin: 'B08R9X7K3L', title: 'Pact Women\'s Cotton Crew Tee', brand: 'Pact', category: 'Tops', color: 'Blue', style_tags: 'casual,eco-friendly,classic', price: 19.99, image_url: 'https://m.media-amazon.com/images/I/71X7Y7Z7X5L.jpg', affiliate_link: 'https://www.amazon.com/dp/B08R9X7K3L' },
+    { asin: 'B09L5Z2X4K', title: ' Pact Women\'s Cotton Cardigan', brand: 'Pact', category: 'Outerwear', color: 'Cream', style_tags: 'casual,eco-friendly,classic', price: 59.99, image_url: 'https://m.media-amazon.com/images/I/81X8Z8Z8X6L.jpg', affiliate_link: 'https://www.amazon.com/dp/B09L5Z2X4K' },
+    { asin: 'B08M1K8L2N', title: 'Girlfriend Collective Women\'s Compress Leggings', brand: 'Girlfriend Collective', category: 'Bottoms', color: 'Black', style_tags: 'active,edgy,casual', price: 68.00, image_url: 'https://m.media-amazon.com/images/I/91X9Z9Z9X3L.jpg', affiliate_link: 'https://www.amazon.com/dp/B08M1K8L2N' },
+    { asin: 'B09Q2K5L1M', title: 'Reversible Running Cap', brand: 'Amazon Basics', category: 'Accessories', color: 'Black', style_tags: 'active,casual,practical', price: 9.99, image_url: 'https://m.media-amazon.com/images/I/61Z6J6X6X4L.jpg', affiliate_link: 'https://www.amazon.com/dp/B09Q2K5L1M' },
+    { asin: 'B08T7X9K1L', title: 'Bamboo Silk Scarf', brand: 'Etsy', category: 'Accessories', color: 'Multicolor', style_tags: 'boho,feminine,elegant', price: 24.99, image_url: 'https://m.media-amazon.com/images/I/71X7Y7Z7X6L.jpg', affiliate_link: 'https://www.amazon.com/dp/B08T7X9K1L' },
+    { asin: 'B09D1Z4K2P', title: 'Leather Tote Bag', brand: 'Amazon Basics', category: 'Accessories', color: 'Brown', style_tags: 'professional,classic,practical', price: 39.99, image_url: 'https://m.media-amazon.com/images/I/81X8Z8Z8X7L.jpg', affiliate_link: 'https://www.amazon.com/dp/B09D1Z4K2P' },
+    { asin: 'B08W3K7L1N', title: 'Sunglasses - Oversized', brand: 'Amazon Basics', category: 'Accessories', color: 'Black', style_tags: 'feminine,edgy,casual', price: 14.99, image_url: 'https://m.media-amazon.com/images/I/91X9Z9Z9X4L.jpg', affiliate_link: 'https://www.amazon.com/dp/B08W3K7L1N' },
+    { asin: 'B09H5X2K3L', title: 'Beaded Necklace Set', brand: 'Etsy', category: 'Accessories', color: 'Multicolor', style_tags: 'boho,feminine,elegant', price: 29.99, image_url: 'https://m.media-amazon.com/images/I/61Z6J7X7X9L.jpg', affiliate_link: 'https://www.amazon.com/dp/B09H5X2K3L' }
+  ];
+
+  seedProducts.forEach(product => {
+    db.run(
+      `INSERT OR IGNORE INTO products (asin, title, brand, category, color, style_tags, price, image_url, affiliate_link) 
+       VALUES (?, ?, ?, ?, ?, ?, ?, ?, ?)`,
+      [
+        product.asin,
+        product.title,
+        product.brand,
+        product.category,
+        product.color,
+        JSON.stringify(product.style_tags),
+        product.price,
+        product.image_url,
+        product.affiliate_link
+      ],
+      (err) => {
+        if (err) console.error('Error inserting product:', err);
+      }
+    );
+  });
+};
+
+// Initialize database and load seed data
+loadSeedProducts();
+
+// Start server
+app.listen(PORT, () => {
+  console.log(`Server running on port ${PORT}`);
+});
--- a/wardrobe-ai/frontend/.eslintrc.json
+++ b/wardrobe-ai/frontend/.eslintrc.json
@ -0,0 +1,3 @@
+{
+  "extends": "next/core-web-vitals"
+}
--- a/wardrobe-ai/frontend/next.config.js
+++ b/wardrobe-ai/frontend/next.config.js
@ -0,0 +1,14 @@
+/** @type {import('next').NextConfig} */
+const nextConfig = {
+  reactStrictMode: true,
+  async rewrites() {
+    return [
+      {
+        source: '/api/:path*',
+        destination: 'http://localhost:3001/api/:path*'
+      }
+    ]
+  },
+}
+
+module.exports = nextConfig
--- a/wardrobe-ai/frontend/package-lock.json
+++ b/wardrobe-ai/frontend/package-lock.json
--- a/wardrobe-ai/frontend/package.json
+++ b/wardrobe-ai/frontend/package.json
@ -0,0 +1,21 @@
+{
+  "name": "wardrobe-ai-frontend",
+  "version": "0.1.0",
+  "private": true,
+  "scripts": {
+    "dev": "next dev",
+    "build": "next build",
+    "start": "next start",
+    "lint": "next lint"
+  },
+  "dependencies": {
+    "next": "^14.0.0",
+    "react": "^18.2.0",
+    "react-dom": "^18.2.0"
+  },
+  "devDependencies": {
+    "autoprefixer": "^10.4.16",
+    "postcss": "^8.4.31",
+    "tailwindcss": "^3.3.0"
+  }
+}
--- a/wardrobe-ai/frontend/postcss.config.js
+++ b/wardrobe-ai/frontend/postcss.config.js
@ -0,0 +1,6 @@
+module.exports = {
+  plugins: {
+    tailwindcss: {},
+    autoprefixer: {},
+  },
+}
--- a/wardrobe-ai/frontend/src/components/CuratedBox.js
+++ b/wardrobe-ai/frontend/src/components/CuratedBox.js
@ -0,0 +1,238 @@
+import { useState, useEffect } from 'react';
+import { useRouter } from 'next/router';
+
+export default function CuratedBox() {
+  const router = useRouter();
+  const [box, setBox] = useState(null);
+  const [feedback, setFeedback] = useState({});
+  const [userId, setUserId] = useState(null);
+
+  useEffect(() => {
+    const userIdParam = router.query.userId;
+    if (userIdParam) {
+      setUserId(userIdParam);
+      generateBox(userIdParam);
+    }
+  }, [router.query]);
+
+  const generateBox = async (userId) => {
+    try {
+      // For now, use placeholder preferences - in real app, fetch from user profile
+      const response = await fetch('/api/box', {
+        method: 'POST',
+        headers: { 'Content-Type': 'application/json' },
+        body: JSON.stringify({
+          userId,
+          preferredColors: ['Black', 'White', 'Navy', 'Grey'],
+          stylePreferences: ['Classic', 'Casual'],
+          budget: 100
+        })
+      });
+      
+      const data = await response.json();
+      setBox(data);
+    } catch (error) {
+      console.error('Error generating box:', error);
+    }
+  };
+
+  const handleFeedbackChange = (productId, field, value) => {
+    setFeedback(prev => ({
+      ...prev,
+      [productId]: {
+        ...prev[productId],
+        [field]: value
+      }
+    }));
+  };
+
+  const submitFeedback = async (productId) => {
+    const userFeedback = feedback[productId];
+    if (!userFeedback) return;
+
+    try {
+      await fetch('/api/feedback', {
+        method: 'POST',
+        headers: { 'Content-Type': 'application/json' },
+        body: JSON.stringify({
+          userId,
+          productId,
+          wouldKeep: userFeedback.wouldKeep,
+          fitRating: userFeedback.fitRating,
+          styleRating: userFeedback.styleRating,
+          colorRating: userFeedback.colorRating,
+          qualityRating: userFeedback.qualityRating
+        })
+      });
+    } catch (error) {
+      console.error('Error submitting feedback:', error);
+    }
+  };
+
+  if (!box) {
+    return (
+      <div className="min-h-screen flex items-center justify-center">
+        <div className="animate-spin rounded-full h-16 w-16 border-t-4 border-purple-600"></div>
+      </div>
+    );
+  }
+
+  return (
+    <div className="max-w-7xl mx-auto px-4 py-8">
+      <div className="text-center mb-12">
+        <h1 className="text-4xl font-bold text-gray-900 mb-4">Your Curated Box</h1>
+        <p className="text-gray-600">
+          Based on your preferences, we've selected {box.totalMatches} items just for you
+        </p>
+      </div>
+
+      <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
+        {box.products.map(product => (
+          <div key={product.id} className="bg-white rounded-xl shadow-lg overflow-hidden">
+            <div className="relative aspect-video">
+              <img
+                src={product.image_url}
+                alt={product.title}
+                className="w-full h-full object-cover"
+              />
+            </div>
+            <div className="p-6">
+              <div className="flex justify-between items-start mb-2">
+                <div>
+                  <h3 className="text-xl font-bold text-gray-900">{product.title}</h3>
+                  <p className="text-gray-600">{product.brand}</p>
+                </div>
+                <span className="text-xl font-bold text-purple-600">
+                  ${product.price}
+                </span>
+              </div>
+
+              <div className="flex flex-wrap gap-2 mt-3 mb-4">
+                {JSON.parse(product.style_tags).map(tag => (
+                  <span key={tag} className="px-2 py-1 bg-purple-100 text-purple-700 rounded text-sm">
+                    {tag}
+                  </span>
+                ))}
+              </div>
+
+              <div className="flex items-center justify-between mb-4">
+                <a
+                  href={product.affiliate_link}
+                  target="_blank"
+                  rel="noopener noreferrer"
+                  className="bg-purple-600 text-white px-4 py-2 rounded-lg hover:bg-purple-700 transition-colors"
+                >
+                  Buy on Amazon
+                </a>
+                <span className="text-gray-500 text-sm">
+                  Score: {product.score}/100
+                </span>
+              </div>
+
+              {/* Feedback Form */}
+              <div className="border-t pt-4">
+                <h4 className="font-semibold mb-3">Rate this item:</h4>
+                <div className="space-y-2">
+                  <div>
+                    <label className="block text-sm font-medium mb-1">
+                      Would you keep it?
+                    </label>
+                    <div className="flex gap-2">
+                      <button
+                        onClick={() => handleFeedbackChange(product.id, 'wouldKeep', true)}
+                        className={`px-3 py-1 rounded ${
+                          feedback[product.id]?.wouldKeep === true
+                            ? 'bg-green-500 text-white'
+                            : 'bg-gray-200'
+                        }`}
+                      >
+                        Yes
+                      </button>
+                      <button
+                        onClick={() => handleFeedbackChange(product.id, 'wouldKeep', false)}
+                        className={`px-3 py-1 rounded ${
+                          feedback[product.id]?.wouldKeep === false
+                            ? 'bg-red-500 text-white'
+                            : 'bg-gray-200'
+                        }`}
+                      >
+                        No
+                      </button>
+                    </div>
+                  </div>
+
+                  <div className="grid grid-cols-2 gap-4">
+                    <div>
+                      <label className="block text-sm font-medium mb-1">Fit</label>
+                      <select
+                        onChange={(e) => handleFeedbackChange(product.id, 'fitRating', parseInt(e.target.value))}
+                        className="w-full px-2 py-1 border rounded"
+                      >
+                        <option value="">Select</option>
+                        {[1, 2, 3, 4, 5].map(num => (
+                          <option key={num} value={num}>{num}</option>
+                        ))}
+                      </select>
+                    </div>
+                    <div>
+                      <label className="block text-sm font-medium mb-1">Style</label>
+                      <select
+                        onChange={(e) => handleFeedbackChange(product.id, 'styleRating', parseInt(e.target.value))}
+                        className="w-full px-2 py-1 border rounded"
+                      >
+                        <option value="">Select</option>
+                        {[1, 2, 3, 4, 5].map(num => (
+                          <option key={num} value={num}>{num}</option>
+                        ))}
+                      </select>
+                    </div>
+                    <div>
+                      <label className="block text-sm font-medium mb-1">Color</label>
+                      <select
+                        onChange={(e) => handleFeedbackChange(product.id, 'colorRating', parseInt(e.target.value))}
+                        className="w-full px-2 py-1 border rounded"
+                      >
+                        <option value="">Select</option>
+                        {[1, 2, 3, 4, 5].map(num => (
+                          <option key={num} value={num}>{num}</option>
+                        ))}
+                      </select>
+                    </div>
+                    <div>
+                      <label className="block text-sm font-medium mb-1">Quality</label>
+                      <select
+                        onChange={(e) => handleFeedbackChange(product.id, 'qualityRating', parseInt(e.target.value))}
+                        className="w-full px-2 py-1 border rounded"
+                      >
+                        <option value="">Select</option>
+                        {[1, 2, 3, 4, 5].map(num => (
+                          <option key={num} value={num}>{num}</option>
+                        ))}
+                      </select>
+                    </div>
+                  </div>
+
+                  <button
+                    onClick={() => submitFeedback(product.id)}
+                    className="w-full mt-3 bg-purple-600 text-white py-2 rounded hover:bg-purple-700"
+                  >
+                    Submit Feedback
+                  </button>
+                </div>
+              </div>
+            </div>
+          </div>
+        ))}
+      </div>
+
+      <div className="text-center mt-12">
+        <button
+          onClick={() => router.push('/')}
+          className="bg-gray-600 text-white px-8 py-3 rounded-lg hover:bg-gray-700 transition-colors"
+        >
+          Create New Profile
+        </button>
+      </div>
+    </div>
+  );
+}
--- a/wardrobe-ai/frontend/src/components/Navbar.js
+++ b/wardrobe-ai/frontend/src/components/Navbar.js
@ -0,0 +1,13 @@
+import Link from "next/link";
+
+export default function Navbar() {
+  return (
+    <nav className="bg-white border-b border-gray-200 px-6 py-4">
+      <div className="max-w-7xl mx-auto">
+        <Link href="/" className="text-2xl font-bold text-gray-900">
+          WardrobeAI
+        </Link>
+      </div>
+    </nav>
+  );
+}
--- a/wardrobe-ai/frontend/src/components/StyleProfileForm.js
+++ b/wardrobe-ai/frontend/src/components/StyleProfileForm.js
@ -0,0 +1,310 @@
+import { useState } from 'react';
+
+export default function StyleProfileForm() {
+  const [formData, setFormData] = useState({
+    email: '',
+    sizes: { tops: '', bottoms: '', shoes: '' },
+    preferredColors: [],
+    stylePreferences: [],
+    lifestyle: '',
+    hardLines: [],
+    mustHaves: [],
+    budget: 100
+  });
+
+  const allColors = ['Red', 'Blue', 'Green', 'Yellow', 'Orange', 'Purple', 'Pink', 'Black', 'White', 'Grey', 'Brown', 'Navy'];
+  const allStyles = ['Classic', 'Casual', 'Professional', 'Boho', 'Feminine', 'Edgy'];
+  const allLifestyles = ['Work', 'Casual', 'Active', 'Formal', 'Travel', 'Everyday'];
+  const allHardLines = ['Synthetic', 'Tight', 'Short', 'High Heels', 'Denim'];
+  const allMustHaves = ['Pockets', 'Machine Washable', 'Dry Clean Only', 'Layerable', 'Sustainable'];
+
+  const handleColorChange = (color) => {
+    setFormData(prev => ({
+      ...prev,
+      preferredColors: prev.preferredColors.includes(color)
+        ? prev.preferredColors.filter(c => c !== color)
+        : [...prev.preferredColors, color]
+    }));
+  };
+
+  const handleStyleChange = (style) => {
+    setFormData(prev => ({
+      ...prev,
+      stylePreferences: prev.stylePreferences.includes(style)
+        ? prev.stylePreferences.filter(s => s !== style)
+        : [...prev.stylePreferences, style]
+    }));
+  };
+
+  const handleHardLineChange = (line) => {
+    setFormData(prev => ({
+      ...prev,
+      hardLines: prev.hardLines.includes(line)
+        ? prev.hardLines.filter(l => l !== line)
+        : [...prev.hardLines, line]
+    }));
+  };
+
+  const handleMustHaveChange = (mustHave) => {
+    setFormData(prev => ({
+      ...prev,
+      mustHaves: prev.mustHaves.includes(mustHave)
+        ? prev.mustHaves.filter(m => m !== mustHave)
+        : [...prev.mustHaves, mustHave]
+    }));
+  };
+
+  const handleSubmit = async (e) => {
+    e.preventDefault();
+    
+    try {
+      // Create user
+      const userRes = await fetch('/api/users', {
+        method: 'POST',
+        headers: { 'Content-Type': 'application/json' },
+        body: JSON.stringify({ email: formData.email })
+      });
+      
+      const user = await userRes.json();
+      
+      // Create profile
+      const profileRes = await fetch('/api/profiles', {
+        method: 'POST',
+        headers: { 'Content-Type': 'application/json' },
+        body: JSON.stringify({
+          userId: user.id,
+          sizes: formData.sizes,
+          preferredColors: formData.preferredColors,
+          stylePreferences: formData.stylePreferences,
+          lifestyle: formData.lifestyle,
+          hardLines: formData.hardLines,
+          mustHaves: formData.mustHaves,
+          budget: formData.budget
+        })
+      });
+      
+      if (profileRes.ok) {
+        // Redirect to box generation
+        window.location.href = `/box?userId=${user.id}`;
+      }
+    } catch (error) {
+      console.error('Error:', error);
+      alert('Error creating profile. Please try again.');
+    }
+  };
+
+  return (
+    <div className="max-w-4xl mx-auto px-4 py-8">
+      <div className="text-center mb-12">
+        <h1 className="text-4xl font-bold text-gray-900 mb-4">Style Profile</h1>
+        <p className="text-gray-600">Tell us about your style preferences to get personalized recommendations</p>
+      </div>
+
+      <form onSubmit={handleSubmit} className="space-y-8">
+        {/* Email */}
+        <div>
+          <label htmlFor="email" className="block text-lg font-medium mb-2">Email Address</label>
+          <input
+            type="email"
+            id="email"
+            required
+            className="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-purple-500 focus:border-transparent"
+            value={formData.email}
+            onChange={(e) => setFormData({ ...formData, email: e.target.value })}
+            placeholder="your@email.com"
+          />
+        </div>
+
+        {/* Sizes */}
+        <div>
+          <label className="block text-lg font-medium mb-4">Sizes</label>
+          <div className="grid grid-cols-1 md:grid-cols-3 gap-4">
+            <div>
+              <label htmlFor="tops" className="block text-sm font-medium mb-1">Tops</label>
+              <select
+                id="tops"
+                className="w-full px-4 py-2 border border-gray-300 rounded-lg"
+                onChange={(e) => setFormData({ ...formData, sizes: { ...formData.sizes, tops: e.target.value } })}
+              >
+                <option value="">Select size</option>
+                <option value="XS">XS</option>
+                <option value="S">S</option>
+                <option value="M">M</option>
+                <option value="L">L</option>
+                <option value="XL">XL</option>
+              </select>
+            </div>
+            <div>
+              <label htmlFor="bottoms" className="block text-sm font-medium mb-1">Bottoms</label>
+              <select
+                id="bottoms"
+                className="w-full px-4 py-2 border border-gray-300 rounded-lg"
+                onChange={(e) => setFormData({ ...formData, sizes: { ...formData.sizes, bottoms: e.target.value } })}
+              >
+                <option value="">Select size</option>
+                <option value="XS">XS</option>
+                <option value="S">S</option>
+                <option value="M">M</option>
+                <option value="L">L</option>
+                <option value="XL">XL</option>
+              </select>
+            </div>
+            <div>
+              <label htmlFor="shoes" className="block text-sm font-medium mb-1">Shoes</label>
+              <select
+                id="shoes"
+                className="w-full px-4 py-2 border border-gray-300 rounded-lg"
+                onChange={(e) => setFormData({ ...formData, sizes: { ...formData.sizes, shoes: e.target.value } })}
+              >
+                <option value="">Select size</option>
+                <option value="5">5</option>
+                <option value="6">6</option>
+                <option value="7">7</option>
+                <option value="8">8</option>
+                <option value="9">9</option>
+                <option value="10">10</option>
+                <option value="11">11</option>
+              </select>
+            </div>
+          </div>
+        </div>
+
+        {/* Preferred Colors */}
+        <div>
+          <label className="block text-lg font-medium mb-4">Preferred Colors</label>
+          <div className="flex flex-wrap gap-3">
+            {allColors.map(color => (
+              <button
+                key={color}
+                type="button"
+                onClick={() => handleColorChange(color)}
+                className={`px-4 py-2 rounded-full border-2 transition-all ${
+                  formData.preferredColors.includes(color)
+                    ? 'bg-purple-500 border-purple-500 text-white'
+                    : 'bg-white border-gray-300 hover:border-purple-500'
+                }`}
+              >
+                {color}
+              </button>
+            ))}
+          </div>
+        </div>
+
+        {/* Style Preferences */}
+        <div>
+          <label className="block text-lg font-medium mb-4">Style Preferences</label>
+          <div className="grid grid-cols-2 md:grid-cols-3 gap-3">
+            {allStyles.map(style => (
+              <button
+                key={style}
+                type="button"
+                onClick={() => handleStyleChange(style)}
+                className={`px-4 py-3 rounded-lg border-2 transition-all ${
+                  formData.stylePreferences.includes(style)
+                    ? 'bg-purple-500 border-purple-500 text-white'
+                    : 'bg-white border-gray-300 hover:border-purple-500'
+                }`}
+              >
+                {style}
+              </button>
+            ))}
+          </div>
+        </div>
+
+        {/* Lifestyle */}
+        <div>
+          <label htmlFor="lifestyle" className="block text-lg font-medium mb-2">Lifestyle</label>
+          <select
+            id="lifestyle"
+            required
+            className="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-purple-500 focus:border-transparent"
+            onChange={(e) => setFormData({ ...formData, lifestyle: e.target.value })}
+          >
+            <option value="">Select lifestyle</option>
+            {allLifestyles.map(lifestyle => (
+              <option key={lifestyle} value={lifestyle}>{lifestyle}</option>
+            ))}
+          </select>
+        </div>
+
+        {/* Hard Lines */}
+        <div>
+          <label className="block text-lg font-medium mb-4">Hard Lines (What you won't wear)</label>
+          <div className="grid grid-cols-2 gap-3">
+            {allHardLines.map(line => (
+              <button
+                key={line}
+                type="button"
+                onClick={() => handleHardLineChange(line)}
+                className={`px-4 py-2 rounded-lg border-2 transition-all ${
+                  formData.hardLines.includes(line)
+                    ? 'bg-red-500 border-red-500 text-white'
+                    : 'bg-white border-gray-300 hover:border-red-500'
+                }`}
+              >
+                {line}
+              </button>
+            ))}
+          </div>
+        </div>
+
+        {/* Must Haves */}
+        <div>
+          <label className="block text-lg font-medium mb-4">Must Haves</label>
+          <div className="grid grid-cols-2 md:grid-cols-3 gap-3">
+            {allMustHaves.map(mustHave => (
+              <button
+                key={mustHave}
+                type="button"
+                onClick={() => handleMustHaveChange(mustHave)}
+                className={`px-4 py-2 rounded-lg border-2 transition-all ${
+                  formData.mustHaves.includes(mustHave)
+                    ? 'bg-green-500 border-green-500 text-white'
+                    : 'bg-white border-gray-300 hover:border-green-500'
+                }`}
+              >
+                {mustHave}
+              </button>
+            ))}
+          </div>
+        </div>
+
+        {/* Budget */}
+        <div>
+          <label className="block text-lg font-medium mb-2">Budget</label>
+          <div className="flex gap-4">
+            <button
+              type="button"
+              onClick={() => setFormData({ ...formData, budget: 100 })}
+              className={`px-6 py-3 rounded-lg border-2 transition-all ${
+                formData.budget === 100
+                  ? 'bg-purple-500 border-purple-500 text-white'
+                  : 'bg-white border-gray-300 hover:border-purple-500'
+              }`}
+            >
+              $100
+            </button>
+            <button
+              type="button"
+              onClick={() => setFormData({ ...formData, budget: 250 })}
+              className={`px-6 py-3 rounded-lg border-2 transition-all ${
+                formData.budget === 250
+                  ? 'bg-purple-500 border-purple-500 text-white'
+                  : 'bg-white border-gray-300 hover:border-purple-500'
+              }`}
+            >
+              $250
+            </button>
+          </div>
+        </div>
+
+        <button
+          type="submit"
+          className="w-full bg-purple-600 text-white py-4 rounded-lg text-lg font-semibold hover:bg-purple-700 transition-colors"
+        >
+          Get Your Curated Box
+        </button>
+      </form>
+    </div>
+  );
+}
--- a/wardrobe-ai/frontend/src/globals.css
+++ b/wardrobe-ai/frontend/src/globals.css
@ -0,0 +1,38 @@
+@tailwind base;
+@tailwind components;
+@tailwind utilities;
+
+:root {
+  --max-width: 1200px;
+  --border-radius: 12px;
+}
+
+* {
+  box-sizing: border-box;
+  padding: 0;
+  margin: 0;
+}
+
+html,
+body {
+  max-width: 100vw;
+  overflow-x: hidden;
+}
+
+body {
+  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
+  color: #1a1a1a;
+  line-height: 1.6;
+}
+
+a {
+  color: inherit;
+  text-decoration: none;
+}
+
+@media (prefers-color-scheme: dark) {
+  :root {
+    color: #f0f0f0;
+    background-color: #1a1a1a;
+  }
+}
--- a/wardrobe-ai/frontend/src/layout.js
+++ b/wardrobe-ai/frontend/src/layout.js
@ -0,0 +1,17 @@
+import { Inter } from "next/font/google";
+import "./globals.css";
+
+const inter = Inter({ subsets: ["latin"] });
+
+export const metadata = {
+  title: "WardrobeAI",
+  description: "Personalized clothing curation",
+};
+
+export default function RootLayout({ children }) {
+  return (
+    <html lang="en">
+      <body className={inter.className}>{children}</body>
+    </html>
+  );
+}
--- a/wardrobe-ai/frontend/src/pages/api/[...path].js
+++ b/wardrobe-ai/frontend/src/pages/api/[...path].js
@ -0,0 +1,16 @@
+// Next.js API route proxy to backend
+import { createProxyMiddleware } from 'http-proxy-middleware';
+
+export default function handler(req, res) {
+  const backendUrl = process.env.BACKEND_URL || 'http://localhost:3001';
+  
+  const proxy = createProxyMiddleware({
+    target: backendUrl,
+    changeOrigin: true,
+    pathRewrite: {
+      '^/api': '/api'
+    }
+  });
+
+  return proxy(req, res);
+}
--- a/wardrobe-ai/frontend/src/pages/api/config.js
+++ b/wardrobe-ai/frontend/src/pages/api/config.js
@ -0,0 +1,11 @@
+const { exec } = require('child_process');
+
+export default function handler(req, res) {
+  const PORT = 3001; // Backend port
+
+  if (req.method === 'GET') {
+    res.status(200).json({ backendPort: PORT });
+  } else {
+    res.status(405).end();
+  }
+}
--- a/wardrobe-ai/frontend/src/pages/api/health.js
+++ b/wardrobe-ai/frontend/src/pages/api/health.js
@ -0,0 +1,11 @@
+const { exec } = require('child_process');
+
+export default function handler(req, res) {
+  const PORT = 3001; // Backend port
+
+  if (req.method === 'GET') {
+    res.status(200).json({ backendPort: PORT });
+  } else {
+    res.status(405).end();
+  }
+}
--- a/wardrobe-ai/frontend/src/pages/api/hello.js
+++ b/wardrobe-ai/frontend/src/pages/api/hello.js
@ -0,0 +1,5 @@
+// Next.js API route support: https://nextjs.org/docs/api-routes/introduction
+
+export default function handler(req, res) {
+  res.status(200).json({ name: 'WardrobeAI API' });
+}
--- a/wardrobe-ai/frontend/src/pages/box.js
+++ b/wardrobe-ai/frontend/src/pages/box.js
@ -0,0 +1,13 @@
+import Navbar from "./Navbar";
+import CuratedBox from "./CuratedBox";
+
+export default function BoxPage() {
+  return (
+    <div className="min-h-screen bg-gray-50">
+      <Navbar />
+      <main>
+        <CuratedBox />
+      </main>
+    </div>
+  );
+}
--- a/wardrobe-ai/frontend/src/pages/index.js
+++ b/wardrobe-ai/frontend/src/pages/index.js
@ -0,0 +1,13 @@
+import Navbar from "./Navbar";
+import StyleProfileForm from "./StyleProfileForm";
+
+export default function Home() {
+  return (
+    <div className="min-h-screen bg-gray-50">
+      <Navbar />
+      <main>
+        <StyleProfileForm />
+      </main>
+    </div>
+  );
+}
--- a/wardrobe-ai/frontend/tailwind.config.js
+++ b/wardrobe-ai/frontend/tailwind.config.js
@ -0,0 +1,10 @@
+/** @type {import('tailwindcss').Config} */
+module.exports = {
+  content: [
+    "./src/**/*.{js,jsx,ts,tsx}",
+  ],
+  theme: {
+    extend: {},
+  },
+  plugins: [],
+}
--- a/wardrobe-ai/frontend/tsconfig.json
+++ b/wardrobe-ai/frontend/tsconfig.json
@ -0,0 +1,28 @@
+{
+  "compilerOptions": {
+    "target": "es5",
+    "lib": ["dom", "dom.iterable", "esnext"],
+    "allowJs": true,
+    "skipLibCheck": true,
+    "strict": true,
+    "forceConsistentCasingInFileNames": true,
+    "noEmit": true,
+    "esModuleInterop": true,
+    "module": "esnext",
+    "moduleResolution": "bundler",
+    "resolveJsonModule": true,
+    "isolatedModules": true,
+    "jsx": "preserve",
+    "incremental": true,
+    "plugins": [
+      {
+        "name": "next"
+      }
+    ],
+    "paths": {
+      "@/*": ["./src/*"]
+    }
+  },
+  "include": ["next-env.d.ts", "**/*.ts", "**/*.tsx", ".next/types/**/*.ts"],
+  "exclude": ["node_modules"]
+}
--- a/wardrobe-ai/package.json
+++ b/wardrobe-ai/package.json
@ -0,0 +1,23 @@
+{
+  "name": "wardrobe-ai",
+  "version": "0.1.0",
+  "description": "Personalized clothing curation engine",
+  "main": "server/index.js",
+  "scripts": {
+    "dev": "concurrently \"npm run dev:frontend\" \"npm run dev:backend\"",
+    "dev:frontend": "cd frontend && npm run dev",
+    "dev:backend": "cd backend && npm run dev",
+    "build": "cd frontend && npm run build",
+    "start": "cd backend && node index.js"
+  },
+  "keywords": [
+    "wardrobe",
+    "curation",
+    "amazon",
+    "recommendations"
+  ],
+  "license": "MIT",
+  "devDependencies": {
+    "concurrently": "^8.2.2"
+  }
+}