StyledGenie - AI-Powered Shopify Fashion App

An MVP Shopify app that uses AI to recommend complete outfits via a storefront chatbot and merchant dashboard.

Project Structure

styledgenie/
├── apps/
│   ├── backend/          # Node.js + Express API server
│   ├── dashboard/        # React + Polaris merchant dashboard (Shopify embedded)
│   └── widget/           # React chat widget (injected into storefront)
├── packages/
│   └── shared/           # Shared types, utilities, constants
├── infra/                # AWS / Docker / deployment config
├── .env.example
├── .gitignore
├── package.json          # Root workspace package.json
└── README.md

Quick Start

Prerequisites

• Node.js 18+
• PostgreSQL 14+
• pgvector extension
• Docker & docker-compose (optional)

Setup

1. Install dependencies

   npm install

2. Copy environment files

   cp .env.example apps/backend/.env
   cp .env.example apps/dashboard/.env
   cp .env.example apps/widget/.env

3. Start PostgreSQL (with docker-compose)

   docker-compose up postgres -d

4. Run database migrations

   npm run migrate

5. Start development servers

   npm run dev

Architecture

Backend (apps/backend)

• Express.js API server
• Shopify OAuth integration
• Product sync with OpenAI embeddings
• Chat API with RAG (Retrieval Augmented Generation)
• Analytics tracking
• Webhook handling

Dashboard (apps/dashboard)

• React + Polaris UI
• Shopify App Bridge integration
• Analytics visualization
• Product sync management
• Merchant rules/FAQs editor
• Chat logs viewer

Widget (apps/widget)

• React chat widget (IIFE bundle)
• Auto-injected via Shopify script tag
• Image upload support
• Floating button UI
• Session persistence

Key Features

✨ AI-Powered Outfit Recommendations

• Multi-product outfit suggestions
• Image recognition for style matching
• Context-aware styling tips

📊 Merchant Dashboard

• Real-time analytics
• Customer chat logs
• Product sync status
• Custom style rules & FAQs

🛍️ Widget

• Embedded storefront chatbot
• Image upload for style analysis
• Product recommendations with images
• Session persistence

Technology Stack

• Backend: Node.js, Express, PostgreSQL, pgvector
• Frontend: React, Polaris (Shopify design system)
• AI: OpenAI (embeddings, GPT-4, GPT-4o)
• Deployment: Docker, AWS (ECS, RDS, S3)

Deployment

See infra/ for AWS deployment configs (ECS, RDS, S3).

Development Milestones

See the mission specification for detailed milestone checklist and security requirements.